0

我使用以下代码向我的 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。

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

编辑：表单和页面也是使用 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-hiddenwith的类display: none。经过进一步调查，我意识到 jQuery Mobile 文档中的示例具有相同的类，但没有display: none. 事实证明，我自己的 css 类一直是通过覆盖 jQuery Mobileui-btn-hidden类引起的。我将我的 css 类的名称更改为btn-hide并且一切正常。

感谢大家的帮助。

4

0 回答 0