Question

我使用以下代码在我的jQuery Mobile应用程序中为表单添加了一个提交按钮：

$('<input data-theme=\"b\" type=\"submit\" value=\"Submit\">').click(self._performQuery);

这样就可以成功地将该按钮添加到表单中，并使用其他父元素进行样式设置。此代码创建的整体标记如下所示：

<div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="b" data-disabled="false"
class="ui-submit ui-btn ui-shadow ui-btn-corner-all ui-btn-up-b" aria-disabled="false">
  <span class="ui-btn-inner">
    <span class="ui-btn-text">Submit</span>
  </span>
  <input data-theme="b" type="submit" value="Submit" class="ui-btn-hidden" data-disabled="false" />
</div>

请注意，该按钮包含在由jQuery Mobile创建的其他元素中以用于样式设置，并且class="ui-btn-hidden"具有样式display: none。

由于隐藏按钮，因此无法识别click事件。这是一个错误吗？我没有在文档中看到任何暗示这种行为的内容。任何人都可以提供解决方法吗？

修改：表单和页面都是使用Javascript动态创建的。

我尝试在上面的代码示例中的.button()之前添加.click，然后按钮甚至没有渲染。

我已经尝试在将该按钮添加到表单并添加click事件后没有运气时选择该按钮。

正如@Omar建议的那样，我尝试将click事件添加到按钮范围内的document，但也无效：

$("#" + this.queryWindow).on("pageshow", function() {
    $(document).on('click', '#' + self.queryButton, function() {console.log("click");});
});

我仔细查看了jQuery Mobile文档中的示例，这些按钮的渲染方式与我的完全相同，但这些按钮仍然可以隐藏点击事件。

如果我以编程方式致电$('#querySubmit').click()，则会调用self._performQuery，但它无法识别用户点击。

解决方案：

所以当我撞到墙上2天后，我觉得这个有点愚蠢。事实证明，在我的一个css样式表中，我使用ui-btn-hidden创建了一个名为display: none的类。经过进一步调查，我意识到jQuery Mobile文档中的示例具有相同的类，但没有display: none。事实证明，我自己的css类通过覆盖jQuery Mobile ui-btn-hidden类一直导致问题。我将我的css类的名称更改为btn-hide，一切正常。

感谢大家的帮助。

jQueryMobile提交按钮不会单击

0 个答案: