ajaxどのように振り返ってhtmlの一部分を書きますか?

3185 ワード

ajaxは直接に普通は1つのデータに帰ることができて、しかし1つのhtmlの一部分について、それとも舞台裏でゆっくりつづり合わせるならば、それはあまりに面倒で、どのように彼を帰らせますか?実はとても簡単です.次に私達のspring mvcを例にして説明します.
一般的に私達は一つのcontrolからページに異動します.
@Request Mapping(「templateManage 2」)
public String toManage 2(Emp emp,Model model){
emp.setId(1)
emp.setName(「hahaha」)
model.addAttribute(「emp」、emp);
 
model.addAttribute(“a”、“123”);
return"/empfile/empp"
)
これはサーバー側のジャンプです.これで直接ページに値を伝えて表示します.この前はaラベルとか直接ジャンプしたり、JSのwindowsのオープン方法かもしれません.
 
でも、私達はないと思っています.もしフロントエンドがajaxでお願いすればいいですか?(ajax要求の戻りタイプは)切記)
このようにajaxのfunctionは大きい段のhtmlコードを返します.これはこのemp.jspページのコードです.いいです.だから、あなたはemp.jspのセグメントを定義することができます.また、ページでおなじみのCタグを使って、controlの値をページに持ち帰ることができます.
コードを見る:
<%@ include file="/WEB-INF/include/taglib.jspf"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<c:forEach items="${userList}" var="user" varStatus="c">
	<dl onclick="writeLectureRecordsInnerInput(${user.id});">
		<dd>
			<jy:di key="${user.userId }" className="com.mainbo.jy.uc.service.UserService" var="u"/>
			<ui:photo src="${u.photo}"></ui:photo>
		</dd>
		<dt>
			<h2>${user.username}</h2>
		</dt>
	</dl>
</c:forEach>
 あなたが返すコードの断片を直接書いてもいいです.
function updateState(id,state,obj){
	$.ajax( {    
	    url:_WEB_CONTEXT_+'jy/lecturerecords/changeShare',//     action    
	    data:{    
	        id : id,
	        state:state
	    },    
	    type:'post',    
	    cache:false,    
	    dataType:'html',    
	    success:function(data) {
	    	var deleteFlag=$(data).find("#isdelete").val();//      
	    	if(deleteFlag=="0"){//    
	    		var quxiaofenxiang=$(data).find("#isshare").val();//      
	    		if(quxiaofenxiang!=""){
	    			alert(quxiaofenxiang);
	    		}
	    		$(obj).parents("tr").html($(data).html());
	    	}else if(deleteFlag=="1"){//    
	    		$(obj).parents("tr").remove();
	    	}
	    },    
	     error : function() {    
	          alert("        !");    
	     }    
	});
}    function   data       html  ,     jQuery        ,         !!  data  ,      jQuery html           。
var quxiaofenxiang=$(data).find("#isshare").val(); jQuery    data     
 
 
$(obj).parents("tr").html($(data).html());jQuery