jquery- ajax呼び出し後の要素値を変更します。

Question

enter 

シナリオ：ajaxコールを使用して、表示されているイメージを更新したいとします。例：クリックして有効にし、もう一度クリックすると無効になります。

初めてクリックすると画像が正しく変更されるようになりました。

その後、再度imgをクリックすると、変更はもう反映されません。

理由は、onclickの状況はまだ= YES 私はこちらをご参照？

<a href="#" onclick="update('7','yes')" ><img id=img7 border=0 src="img/active.gif" ></a> 





function update(pk,enable) 
{ 

    $.ajax({ 

    url: "ajaxcall.asp", 

    type: "POST",      


    success: function(output) { 

     var status= output 
     if(status==1){    
      var src = ($('#'+'img'+pk).attr("src") == "img/cross.gif")? "img/tick.gif": "img/cross.gif"; 
      $('#'+'img'+pk).attr("src", src);  

    //REFER HERE 

     } 

    }, 

    complete: function(){ }, 

    data: 'pk='+pk+'&enable='+enable 

    });   
} 

で（ '7'、 'ノー'）のonclick = "更新にonclickの部分を書き換えるために、ハイパーリンクの要素にアクセスするにはどうすればよいですここ

Answer 1

私はこのようにします。まず：

<a id="a7" href="#"><img border="0" src="img/active.gif"></a> 

はその後

$(function() { 
    $("#a7").update("7"); 
}); 

function update(pk) { 
    var img = $("#img" + pk); 
    if (img.attr("src") == "img/cross.gif") { 
    enable = "no"; 
    var src = "img/cross.gif"; 
    } else { 
    enable = "yes"; 
    var src = "img/tick.gif"; 
    } 
    $.ajax({ 
    url: "ajaxcall.asp", 
    type: "POST",      
    success: function(output) { 
     var status = output; 
     if (status == 1) { 
     img.attr("src", src); 
     } 
    }, 
    complete: function(){ }, 
    data: 'pk='+pk+'&enable='+enable 
    });   
} 

あなたはyesまたはnoに渡す必要はありません。イメージsrcから派生させることができます。

Answer 2

簡単な方法アウト：

これを置き換えます

$('#'+'img'+pk).attr("src", src);  

これに0

：

$('#'+'img'+pk).attr("src", src).parent('a').attr('onClick','update("7","no")'). 

正しい方法：このJavascriptがunobtrusiveあるべき

。そうであれば、jQueryのイベントバインディングシステムを使用してイベントを一度実行し、バインドを解除することができます。