Question

我想在点击某个div（'。checkcker'）后触发输入上的click事件。换句话说，单击“.checker”会模拟复选框上的click事件，远程检查它。

我编写的代码有效，但只有在第二次点击后点击触发器，第一次失败时才会触发。这甚至不会发生在'.checker'上，也发生在复选框上。

以下所有这些HTML都包含在jquery折叠菜单中。单击'h3'后，.sub-tree-wrap'折叠。 'e.stopPropagation'用于防止冒泡，导致菜单崩溃。

jquery制服的工作原理是：点击输入（复选框）气泡，然后在'.control_multi'中切换span和div（'。checker'）上的类 - http://uniformjs.com/

在jsfiddle它可以工作，但没有jquery unform - http://jsfiddle.net/mciastek/PQP9S/3/（thx Mark S）

重要的是，我只能通过Javascript / jQuery操作HTML。

HTML

<h3><div class='checker'></div></h3>
  <div class='sub-tree-wrap'>
    <div></div>
      <div class='control_multi'>
        <div>
          <span>
            <div class='checker'>
              <span>
                <input type='checkbox'>
              </span>
            </div>
         </span>
        </div>
      </div>
    </div>
  </div>

Javascript / jQuery

   $('h3 > .checker').click(function(e){
            // prevent list collapse after click
            e.stopPropagation();
            $this = $(this);
            // if has control_open or checkbox is disabled don't run multiple checking
            var subTree = $this.parent().next();
            if( (!subTree.hasClass('has-open')) && !($this.hasClass('disabled')) ) {
                var inputCheck = $this.parent().next().find('.control_multi').find('input:checkbox')
                inputCheck.trigger('click');
            }
            // toggle class .checked after click
            $this.children('span').toggleClass('checked');
        });

Answer 1

由于'.checkbox'是<input>元素，因此请使用触发器'focus'。

$('h3 > .checker').click(function(e){
        // prevent list collapse after click
        e.stopPropagation();
        $this = $(this);
        // if has control_open or checkbox is disabled don't run multiple checking
        var subTree = $this.parent().next();
        if( (!subTree.hasClass('has-open')) && !($this.hasClass('disabled')) ) {
            var inputCheck = subTree.find('.control_multi .checkbox')
            inputCheck.trigger('focus');
        }
        // toggle class .checked after click
        $this.children('span').toggleClass('checked');
});

请参阅此jsfiddle

首次单击不会触发事件

1 个答案: