jQuery .live 和parent() 问题

发布于 2024-10-12 14:06:51 字数 1106 浏览 7 评论 0原文

我有很多这样的代码片段:

<li>
  <label>
    <a title="Cadeo">
      <span class="container">
        <img class="shadow" src="../public/4cf54b32bd723_small.jpg" alt="" />
      </span>
    </a>
    <input name="Trailer" type="radio" value="1" />
    <span class="change">Seleziona</span>
  </label>
</li>

感谢这个 jQuery 代码,当单击标签(包含所有标签)时,“Seleziona”文本被替换为按钮标签:

$('label').click(function(){
  $('label').children('span.change').html('Seleziona'); // reset the others li's text
  $(this).children('span.change').html('<button type="button" class="small middle"><img src="../images/vota-small.png" alt="" /></button>')
})

现在是棘手的部分:我试图捕获的值无线电输入标签,但这不起作用(我正在使用 .live 函数,因为该按钮是在运行时创建的)

$('button').live('click', function(){
  alert($(this).parent().siblings('input').val());
})

我哪里错了?我总是得到“未定义”...... 提前感谢您的回答

如果有帮助,这里有一个实时版本: http://jsfiddle.net/H4Gsq/< /a>

I have many of this snippet code:

<li>
  <label>
    <a title="Cadeo">
      <span class="container">
        <img class="shadow" src="../public/4cf54b32bd723_small.jpg" alt="" />
      </span>
    </a>
    <input name="Trailer" type="radio" value="1" />
    <span class="change">Seleziona</span>
  </label>
</li>

Thanks to this jQuery code, when clicking on tag (that contains all) the "Seleziona" text is replaced with a button tag:

$('label').click(function(){
  $('label').children('span.change').html('Seleziona'); // reset the others li's text
  $(this).children('span.change').html('<button type="button" class="small middle"><img src="../images/vota-small.png" alt="" /></button>')
})

Now comes the tricky part: I'm trying to catch the value of the radio input tag, but this doesn't work (I am using the .live function since the button is created at runtime)

$('button').live('click', function(){
  alert($(this).parent().siblings('input').val());
})

Where am I wrong? I keep getting "undefined"...
Thanks in advance for the answers

If it can help, here is a live version: http://jsfiddle.net/H4Gsq/

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

青芜 2024-10-19 14:06:51

试试这个 -

$('button').live('click', function(e){
  e.stopPropagation();
  alert($(this).parent().prev('input').val());

})

实际上,当您当时单击按钮时,单击甚至会传播到标签,因此标签单击功能也会被触发。这种效应称为冒泡。
为了步进事件冒泡,我使用了e.stopPropagation()

Try this -

$('button').live('click', function(e){
  e.stopPropagation();
  alert($(this).parent().prev('input').val());

})

Actually when you click button at that time that click would even propogate to label and hence labels click function will also be triggered. This effect is known as bubbling.
To step event bubbling i have used e.stopPropagation()

沙沙粒小 2024-10-19 14:06:51

首先,为什么要使用parent()?输入是跨度的同级,而不是其父级的同级。 其次,当您单击按钮时,两个事件处理程序都会触发。 stopPropagation 没有任何帮助,因为 live 本身依赖于事件冒泡;此外,实时事件处理程序在正常事件处理程序之后触发。您应该检查 event.target ,如果它是一个按钮,请跳过标签的点击处理程序。

第一部分忘记了,我没有仔细阅读代码。无论如何,这是一个更正的版本: http://jsfiddle.net/H4Gsq/1/

First, why the parent()? The input is the sibling of the span, not the sibling of its parent. Second, both event handlers will fire when you click the button. stopPropagation is no help as live itself relies on event bubbling; also, live event handlers fire after normal event handlers. You should check event.target and if it is a button, skip the click handler of the label.

Forget the first part, I didn't read the code carefully. Anyway, here is a corrected version: http://jsfiddle.net/H4Gsq/1/

凉城已无爱 2024-10-19 14:06:51

为什么不触发自定义触发器,然后相应地操作它......

$("input[type='radio']").trigger("checked");

$("input[type='radio']").live('checked',function(){

alert($(this).parent().prev('input').val());

})

why not fire a custom trigger and then manipulate it accordingly...

$("input[type='radio']").trigger("checked");

$("input[type='radio']").live('checked',function(){

alert($(this).parent().prev('input').val());

})
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文