使用jQuery在span元素上的onclick事件

Question

I have the following HTML:

<a title="Prev" data-event="click" data-handler="prev" class="ui-datepicker-prev ui-corner-all">
       <span class="ui-icon ui-icon-circle-triangle-w">Prev</span>
   </a>

我可以帮助您翻译以下内容。这段代码需要使用jQuery在单击span后更改“Prev”文本。

这是我的代码：

$(".ui-icon.ui-icon-circle-triangle-w").click(function(){ 
    $(".ui-icon.ui-icon-circle-triangle-w").html('«');         
});

但是它没有起作用，为什么呢？

- Ayman Hussein

Answer 1

也许你的代码执行得太早了。当你的代码执行时，你的HTML元素尚不存在，因此$(".ui-icon.ui-icon-circle-triangle-w")是空的。

你可以使用以下方法:

$("body").on('click', ".ui-icon.ui-icon-circle-triangle-w", function(){ 
    $(this).html('«');         
});

- Magus

Answer 2

给你的添加一个类：

<a title="Prev" data-event="click" data-handler="prev" class="ui-datepicker-prev ui-corner-all">
       <span class="prevSpan ui-icon ui-icon-circle-triangle-w">Prev</span></a>

然后通过jQuery使用它：

$(".prevSpan").text("«");

您需要一个用于点击事件的事件处理程序，使用.on()
最终代码如下：

$(document).ready(function(){
  $('.prevSpan').on('click',function(){
    $(".prevSpan").text("«");
  });
});

.on()事件处理程序的文档http://api.jquery.com/on/

- Munchies

Answer 3

$(".ui-icon .ui-icon-circle-triangle-w").click(function(){ 
    $(this).html('«');         
});

- Syed Ali

---

请不要仅仅发布代码作为答案，还要提供解释您的代码是如何解决问题的。带有解释的答案通常更有帮助和更高质量，并且更有可能吸引赞同。 - Mark Rotteveel