jQuery按钮单击自定义对话框标题

我正在创建一个自定义<div>作为对话框的标题。

<div>的内部是<table>。 <table>包含1 <tr>，其包含5个<td>。每个<div>的内部都是要在对话框标题中显示的实际内容。

我想显示一些jQuery按钮对象，以允许用户编辑标题中的任何信息。我已将点击事件附加到该按钮，并将另一个点击事件附加到标题。点击按钮，调用标头的点击事件，但按钮的点击事件永远不会被调用。

这里的对话框中点击标题中的代码：

$(dialog) 
    .parent() 
    .find('.ui-dialog-titlebar').click(
     function() { 
      $(dialog).dialog('close').remove(); 
     } 
    );

这里的按钮创建代码：

var editBtn = $('<button>'); 
editBtn 
    .css('height', '2.2em') 
    .css('float', 'right') 
    .button(
     { 
      text: false, 
      icons: 
       { 
        primary: 'ui-icon-pencil' 
       } 
     } 
    ) 
    .on(
     'click', 
     function() { 
      alert('Edit clicked'); 
      EditClicked(this); 
      return false; 
     } 
    );

任何想法如何，我可以解决这个问题？

来源

2012-08-10 mbm29414

可能是这样的情况，用jQuery，你选择的是<button>而不是button。我从来没有试过选择带有标签的html对象。你的风格是否被添加到按钮？另外，对于css使用散列：

.css({'height':'2.2em','float':'right'})

如果您调用css两次，高度可能会被覆盖。

另一个提示使用.closest('.ui-dialog-titlebar')而不是执行.parent().find()的两个方法调用。

干杯！

来源

2012-08-10 17:52:43 Luke

其实，我不是选择'

.on大概是不是你想要什么。其目的是将通用事件处理程序附加到给定元素内与给定选择器匹配的任何元素上，而不管它们何时创建。

您需要改为将事件处理程序附加到特定对象的.bind()。

所以，这个代码应该做的工作：

var editBtn = $('<button>'); 
editBtn 
    .css({ 
     'height': '2.2em', 
     'float': 'right' 
    }) 
    .button(
     { 
      text: false, 
      icons: 
       { 
        primary: 'ui-icon-pencil' 
       } 
     } 
    ) 
    .bind(
     'click', 
     function() { 
      alert('Edit clicked'); 
      EditClicked(this); 
      return false; 
     } 
    );

（作为加：你能避免传递一个对象链接.css()）。

来源

2012-08-10 19:19:35 redShadow

jQuery按钮单击自定义对话框标题

回答

相关问题