Question

我已经设置了一个jsfiddle http://jsfiddle.net/bababalcksheep/Wbnj2/15/

按照以下步骤了解我的问题。

点击“添加水果”上的+图标暂无任何操作
点击“添加汽车”

现在在输入框中添加一些文本，然后单击“确定”。 确定按钮停止工作，但为什么????。

这真让我烦恼。但是，如果单击“添加水果”上的+图标并将输入框保留为空，则无效。只需按关闭按钮。

因此，如果我每次都按下关闭按钮，那么。如果我跳过关闭按钮并单击下一步+按钮，确定停止工作，直到我重新打开点击并按关闭按钮。任何IDEAS？

HTML

  <div class="control-group">
    <label class="control-label">Add Fruits</label>
    <div class="controls">
        <div class="input-append">
        <select id="fruits">
           <option>apple</option>
           <option>ornage</option>
        </select>
        <button data-attach="fruits " data-key="1 " rel="PERA"  class="btn " type="button"><i class="icon-plus "></i></button>                           
       </div>
    </div>
</div>

<div class="control-group">
    <label class="control-label">Add cars</label>
    <div class="controls">
        <div class="input-append">
        <select id="cars">
           <option>suzuki</option>
           <option>toyota</option>
        </select>
        <button data-attach="cars " data-key="2 " rel="PERA"  class="btn " type="button"><i class="icon-plus "></i></button>                             
       </div>
    </div>
</div>

JQUERY

 jQuery(document).ready(function ()
{
  $('[rel*=PERA]').clickover(
  {
    html: true,
    placement: 'right',
    trigger: 'click',
    width: 350,
    title: '<strong>Add new</strong>',
    content: '',
    allow_multiple: false,
    global_close: false,
    onShown: function ()
    {
      var myid = generateUUID();
      var content = '<div id="' + myid + '"><div class="row" style="margin: 10px; "><input class="small m-wrap new_value" type="text" placeholder="Enter Value "/><button class="btn blue update_sel" type="submit"><i class="icon-ok icon-white"></i></button><button class="btn editable-cancel" type="button" data-dismiss="clickover"><i class="icon-remove"></i></button></div><div class="rspmsg" style="clear: both"> </div></div>';
      $("div.clickover").find("div.popover-content").html(content);

      var me = $('#' + myid);
      var clickover = this;
      var base = $('#' + clickover.options.attach);
      var updatebutton = me.find("button.update_sel");
      var newvalue = me.find("input.new_value");
      var closeclickover = me.find("button.editable-cancel");
      updatebutton.click(function (event)
      {
        event.preventDefault();
        setTimeout(function ()
        {
          // heavy lifting
          base.append($("<option></option>").attr("value", 13).attr("selected", "selected").text(newvalue.val()));
          closeclickover.click();
        }, 100);
      });

    },
  });
});

更新

如果我添加点击选项onHidden: function () {alert("hiding");}, 然后它开始工作。但是如果我从onhidden取出警报，它会再次停止工作。

Jquery bootstrapx clickover奇怪的问题

0 个答案: