아약스 편집 상자 문제

Question

음, 기본적으로 다음 코드가 있습니다 (jQuery 사용하고 있습니다). 아약스 게시물을 통해 동적으로 필드를 업데이트하는 코드를 사용하고 있습니다. 모두 잘 작동하지만 두 개 이상의 입력 필드가있는 동적으로 생성 된 내용의 코드를 사용할 때 해당 코드가 작동하지 않습니다. 나는 "라이브"를 사용하고 있지만 이것이 작동하지 않는 것 같습니다. 어떤 해결책? 미리 감사드립니다.

내 HTML 코드 :

<span class="text_wrapper"> 
<span class="imageInf"><a href="tag/1235">1235</a></span> 
<a href="javascript:;" class="edit_link" title="Add/Edit"> 
<img src="i/edit.png" class="middle"> 
</a> 
</span> 
<span class="edit" style="display:none"><input type="text" class="editbox" name="mediatags" value="1235"></span> 

내 자바 스크립트 코드 : 당신이 당신의 POST 요청에 1 개 이상의 매개 변수를 전달하려면

//ajax edit box 
$(document).ready(function() 
{ 
//Edit link action 
$('.edit_link').live("click", function() 
{ 
$('.text_wrapper').hide(); 
var data=$('.text_wrapper').html(); 
$('.edit').show(); 
$('.editbox').html(data); 
$('.editbox').focus(); 
}); 
//Mouseup textarea false 
$(".editbox").mouseup(function() 
{ 
return false 
}); 
//Textarea content editing 
$(".editbox").live("change", function() 
{ 
$('.edit').hide(); 
var boxval = $(".editbox").val(); 
var dataString = 'data='+ boxval; 
$.ajax({ 
type: "POST", 
url: "editPicName.php", 
data: dataString, 
cache: false, 
success: function(html) 
{ 
$('.text_wrapper').html(boxval); 
$('.text_wrapper').show(); 
} 
}); 
}); 
//Textarea without editing. 
$(document).mouseup(function() 
{ 
$('.edit').hide(); 
$('.text_wrapper').show(); 
}); 
}); 

Answer 1

, 당신은 "데이터"에 포함해야하는 옵션 귀하의 $ .ajax 함수 중.

그래서 당신이

 

$.ajax({ 
    type: "POST", 
    url: "editPicName.php", 
    data: "data1=value1&data2=value2", 
    cache: false, 
    success: function(html) 
    { 
    $('.text_wrapper').html(boxval); 
    $('.text_wrapper').show(); 
    } 
}); 

 

과 같을 것이다 $ 아약스 호출 내가 "값 1"을 믿고있어 위치를이 개 입력 필드 "데이터 1"과 "데이터 2"

의 값을 전달하고 싶은 말은 및 "value2"는 해당 입력 필드의 현재 값입니다.

$ .ajax 호출의 데이터 옵션을 JSON으로 보낼 수도 있습니다. 이런 식으로하는 것이 좋습니다. (더 깨끗하게 보입니다)

 

$.ajax({ 
    type: "POST", 
    url: "editPicName.php", 
    data: ({data1 : "value1", data2 : "value2"}), 
    cache: false, 
    success: function(html) 
    { 
    $('.text_wrapper').html(boxval); 
    $('.text_wrapper').show(); 
    } 
});