Jquery-在ajax调用后修改元素值

时间:2022-10-08 07:45:25
enter 

scenario: I want to do an ajax call to update the image shown. Example: click to activate, click again to deactivate.

场景:我想做一个ajax调用来更新显示的图像。示例:单击以激活,再次单击以停用。

Now, image can change correctly when click for first time.

现在,第一次点击时图像可以正确更改。

After that, if I click the img again, changes won't reflect anymore.

之后,如果我再次点击img,更改将不再反映。

Reason, the onclick status still= yes How do I access the hyperlink element to rewrite the onclick part to onclick="update('7','no') at REFER HERE?

原因,onclick状态仍然=是如何在REFER HERE访问超链接元素以将onclick部分重写为onclick =“update('7','no')?

<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

    });         
}

here

2 个解决方案

#1


I'd do it this way. Firstly:

我这样做。首先:

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

then

$(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
  });         
}

You don't need to pass in yes or no. You can derive it from the image src.

你不需要传入是或否。您可以从图像src派生它。

#2


The easy way out:

简单的出路:

Replace this:

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

with this:

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

The right way:

正确的方式:

This Javascript should be unobtrusive. If it were, you could use jQuery's event binding system to run the event once, then unbind it.

这个Javascript应该是不引人注目的。如果是,你可以使用jQuery的事件绑定系统来运行一次事件,然后取消绑定它。

#1


I'd do it this way. Firstly:

我这样做。首先:

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

then

$(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
  });         
}

You don't need to pass in yes or no. You can derive it from the image src.

你不需要传入是或否。您可以从图像src派生它。

#2


The easy way out:

简单的出路:

Replace this:

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

with this:

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

The right way:

正确的方式:

This Javascript should be unobtrusive. If it were, you could use jQuery's event binding system to run the event once, then unbind it.

这个Javascript应该是不引人注目的。如果是,你可以使用jQuery的事件绑定系统来运行一次事件,然后取消绑定它。