Question

我正在尝试在单击动态元素时执行一个函数（在页面加载时不存在），这是我的代码：

jQuery(document).ready(function(){
    jQuery('body').off('click','.itemAttribute').on('click','.itemAttribute',function(){
        var title = jQuery(this).find('img').attr('title');
        jQuery(this).parent().parent().find('select').val(title).change();
  });
})

但是代码只在第二次点击时执行..

动态元素的HTML：

<ul class="attribute-list">
<li class="itemAttribute tbn-images" rel="837"><img src="pathxxx.jpg" title="UNIVERSITY BLUE/DARK"></li>
<li class="itemAttribute tbn-images" rel="838"><img src="pathxdfhdxx.jpg" title="UNIVERSITY RED/DARK"></li>

</ul>

静态HTML：

<select name="super_attribute[92]" id="attribute92" class="required-entry super-attribute-select" onchange="MagicToolboxChangeOptionConfigurable(this, 'farve');" style="visibility: hidden; ">

<option value="">Please choose...</option>
<option value="837" price="0">UNIVERSITY BLUE/DARK</option>
<option value="838" price="0">UNIVERSITY RED/DARK</option>
</select>

请帮助..

注意：在代码中添加警报时，首次执行警报，似乎问题是：

jQuery(this).parent().parent().find('select').val(title).change();

：（

Answer 1

要根据值选择项目，您应该查询rel元素的<li>属性。

var value = this.getAttribute('rel');
jQuery(this).parent().parent().find('select').val(value);

请注意，您使用的选择器很脆弱，但在我下面给出的示例中，它可以按预期工作。

Demo

Answer 2

jQuery(this).parent().parent().find('select').val(title).change();

更改为

jQuery('#attribute92').val(title);

仅在第二次单击后点击动态元素触发事件 - jquery

2 个答案: