jqModal对话 - 只显示一次

Question

我有一个jqModal对话框用下面的代码：

$(document).ready(function() { 

    $('td.item.active').click(function(e) { 

     $(this).append('<div class="new">&nbsp;</div>'); 

      $("#jqModal").jqm({ 
       modal:true, 
       onHide: function(e) { 
        e.w.hide(); // Hide window 
        e.o.remove(); // Remove overlay 
       } 
      }); 

      $('#jqModal').jqmShow(); 

      $('input#add_session').click(function(e) { 
       e.preventDefault(); 
       $('#jqModal').hide(); 
       $('.jqmOverlay').remove(); 
      }); 

    }); 

    }); 

使用的HTML如下：

<div id="jqModal" class="jqmWindow"> 
    <form action="" method="post"> 

     <ul> 

     <li> 
      <input id="add_session" name="commit" type="submit" value="Add Session" /> <input type="button" name="close" value="Close" id="close" class="jqmClose" /> 
     </li> 

     </ul> 

    </form> 
    </div> 

当我第一次点击<td>，则对话框启动没有问题。在第二次点击（或后续）时，new类被添加到<div>，但该对话框不会启动。

Answer 1

在这里黑暗中拍摄，如果你说模式不是重新创建的，尽量不要手动摧毁它，而是将其称为.jqdHide()方法。此外，您input单击处理程序是<td>的点击处理程序中，不知道这是故意的，要解决这两个调整你的代码是：

$(function() { 
    $('td.item.active').click(function(e) { 
    $(this).append('<div class="new">&nbsp;</div>'); 
    $("#jqModal").jqm({ 
     modal:true, 
     onHide: function(e) { 
     e.w.hide(); // Hide window 
     e.o.remove(); // Remove overlay 
     } 
    }).jqmShow(); 
    }); 
    $('input#add_session').click(function(e) { 
    e.preventDefault(); 
    $('#jqModal').jqmHide(); 
    }); 
}); 

如果代码你，你添加<td>元素并单击处理在不触发他们，那么你需要使用.live()所以处理程序适用于当前和未来与该类组合<td>元素，所以不是这样的：

$('td.item.active').click(function(e) { 

你会称之为：

$('td.item.active').live('click', function(e) {