使用jQuery禁用表单中的输入字段

Question

我最近升级到Liferay 6.0，JSF 2.1和jQuery 1.7。

这是我的html表单：

 <h:form id="fundRequestForm" action="" method="post">
      <!-- Inside this I have various form field -->
    </h:form>

在html页面源中生成的表单：

<form id="_jpfcpncuivr_A2262_j_id1:fundRequestForm" name="_jpfcpncuivr_A2262_j_id1:fundRequestForm"
method="post" action="">
</form>

我想禁用隐藏表单字段以外的表单中的所有输入字段。

这是我的javascript

jQuery(document).ready(function()
{
  jQuery('form#_jpfcpncuivr_A2262_j_id1:fundRequestForm input[type!="hidden"]').attr('disabled', 'true');
});

输入字段未被禁用。请告诉我这段代码有什么问题。

Answer 1

虽然在HTML元素ID /名称中有效，但冒号是CSS选择器中的特殊字符，因为它表示伪选择器的开头。你需要在CSS选择器中转义它。

jQuery('form#_jpfcpncuivr_A2262_j_id1\\:fundRequestForm input[type!="hidden"]').attr('disabled', 'true');

另见：

• How to select JSF components using jQuery?（有关替代方案的更详细解答）
• By default, JSF generates unusable ids, which are incompatible with css part of web standards（其他人咆哮说标准不兼容，但答案证明错了）

Answer 2

尝试为其添加一个类：

<h:form id="fundRequestForm" action="" method="post" class="someClass">
  <!-- Inside this I have various form field -->
</h:form>

JS：

jQuery(document).ready(function()
{
  jQuery('.someClass input').prop('disabled', true); //<-- use prop NOT attr
});