为什么$（this）不能在javascript函数中工作？

我已将一个onlick事件附加到函数中。我想引用从函数内部被点击的元素，所以我可以改变它的内部HTML，但为什么它不工作？有没有其他的方式来引用点击元素？

HTML

 <div class="save_button" onclick="toggle_save_star(<?php echo $listing->listing_id ?>,'<?php echo base_url()?>')"> 
      <?php if($listing->saved_element_id):?> 
      <img src="<?php echo site_url('images/core/icons/basic2/star1_16.png')?>" /> 
      <?php else:?> 
      <img src="<?php echo site_url('images/core/icons/basic2/star1_16_gray.png')?>" /> 
      <?php endif; ?> 
     </div>

JavaScript函数

function toggle_save_star(element_id, site_url) { 
    var url = site_url+"AJAX/ajax_default/modify_saved"; 
    var button = $(this); 
    $.post(url,{action: 'toggle', element_id: element_id, type: 'listing' }, function(data) { 
     if(data == 'saved') { 
      $(button).html('<img src="'+site_url+'images/core/icons/basic2/star1_16.png" />'); 
     } 
     else{ 
      $(button).html('<img src="'+site_url+'images/core/icons/basic2/star1_16_gray.png" />'); 
     } 
    }); 
}

来源

2011-09-23 emkay

尝试$("#"+element_id)代替。 $(this)不起作用，因为您没有将此函数作为对象上的方法运行。

提高对其他的答案，试试这个：

$(".save_button").click(function(){ 
toggle_save_star(element_id, site_url, $(this)); 
});

，并在你的函数，第三个新的参数（称为 “target”，让我们说）可以使用这样的：

var button = target;

然后使用按钮，如button.html(...);

来源

2011-09-23 19:56:48 Christian

我认为在这种情况下，“这个”不参考div。你应该尝试：

$('.save_button').click(function(){ 
    $(this)... 
});

来源

2011-09-23 19:57:07

这是一个有用的建议，可以解决问题。 – Christian

也许我错了，但不会强迫我将代码移到所有相关的html页面中？如果不是的话，如果这样写的话，我会如何通过这两个论点？ – emkay

我更新了我的答案以更好地解释。 – Christian

这里的主要问题是，当你在你的标记分配一个字符串的onclick为：

<div class="save_button" onclick="toggle_save_star..."

然后，在报价的代码获得通过EVAL评估（）并且this指针将被设置为指向window对象，而不是指向生成点击的对象。如果你想适当this集，那么你就不能在指定标记中的onclick处理程序，你需要用JS做到这一点，如：

$(".save_button").click();

或在代码中的一些其他方式。

此外，您的toggle_save_star函数中存在编码错误。

button您的button变量已经是jQuery对象，因此您不需要尝试使用$(button)将其变为另一个。如果你要使用该功能，你必须把它改成这样：

function toggle_save_star(element_id, site_url) { 
    var url = site_url+"AJAX/ajax_default/modify_saved"; 
    var button = $(this); 
    $.post(url,{action: 'toggle', element_id: element_id, type: 'listing' }, function(data) { 
     if(data == 'saved') { 
      button.html('<img src="'+site_url+'images/core/icons/basic2/star1_16.png" />'); 
     } 
     else{ 
      button.html('<img src="'+site_url+'images/core/icons/basic2/star1_16_gray.png" />'); 
     } 
    }); 
}

来源

2011-09-23 20:07:14 jfriend00

你会好起来的，从你的DIV删除的onclick，并与一些事情像下面这样：

http://jsfiddle.net/cpeele00/epD3v/

这允许您访问可点击的项目，在这种情况下是'save_button'。

然后，在页面的底部（在到达结束标签之前，在其中插入脚本）。

<script> 

    $(document).ready(function(){ 

    //CALL THE FUNCTION HERE   


    //DEFINE THE FUNCTION HERE (see the jsFiddle link above) 

    }); 

</script> 
</body>

来源

2011-09-23 20:25:56 cpeele00

为什么$（this）不能在javascript函数中工作？

回答

相关问题