0

我有一个表单,我在其中禁用了所有未隐藏在 jQuery(document).ready(function()) 上的输入字段

这是我的代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<div xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
    xmlns:c="http://java.sun.com/jsp/jstl/core" lang="en" xml:lang="en" style="padding-bottom: 8px;">
    <script>
        jQuery(document).ready(function()
        {
            jQuery('div#formBuilderPreviewEnrollmentData input[type!="hidden"]').prop('disabled', true);
        });
    </script>
    <h:form id="previewMarketingProgramForm">
        <div class="modal-content">
            <br /> <br /> <br />
            <div>
                <h4>Enrollment Form</h4>
            </div>
            <table cellpadding="0" cellspacing="0" border="1" width="100%" class="results-table">
                <tr>
                    <td>
                        <div id="formBuilderPreviewEnrollmentData">
                            <h:outputText value="#{previewMarketingProgramBean.enrollmentFormBean.enrollmentFormContent}" escape="false" />
                        </div>
                    </td>
                </tr>
            </table>
            <br /> <br /> <br />
        </div>
    </h:form>
</div>

这是Javascript错误:

无法将焦点移至控件,因为它不可见、未启用或属于不接受焦点的类型。

请告诉我可能导致此错误的原因。我正在使用 jQuery-1.7.2-min.js

以下是此表单的 HTML 生成源代码,供您参考:

<!DOCTYPE html> 
<html class="ltr" dir="ltr" lang="en-US"> <head> <title>View Article - Liferay</title> 
    <script src="http://xx:8001/vcc-theme/js/jquery-1.7.2.min.js"></script> 
    <script src="http://xx:8001/vcc-theme/js/javascript.js"></script> 
    <script src="http://xx:8001/vcc-theme/js/jquery.tablesorter.min.js"></script> 
    <script src="http://xx:8001/vcc-theme/js/jquery.tablesorter.pager.js"></script> 
    <script src="http://xx:8001/vcc-theme/js/jquery.autocomplete.js"></script> 
    <script src="http://xx:8001/vcc-theme/js/jquery.simplemodal.1.4.2.min.js"></script> 
    <script src="http://xx:8001/vcc-theme/js/jquery.scrollTo.js"></script> 
    <script src="http://xx:8001/vcc-theme/js/ui.datepicker.js"></script> 
    <script>
    /*<![CDATA[*/jQuery(document).ready(function()
    {
        jQuery('div#formBuilderPreviewEnrollmentData input[type!="hidden"]').prop("disabled",true)});
    /*]]>*/
     </script> 
     <form id="_jpfcpncuivr_A0169_j_id1:previewMarketingProgramForm" name="_jpfcpncuivr_A0169_j_id1:previewMarketingProgramForm" method="post" 
     action="http://xxx/yyy.do">
         <div class="modal-content"> 
            <br /> <br /> <br /> 
            <div> <h4>Enrollment Form</h4> </div> 
            <table cellpadding="0" cellspacing="0" border="1" width="100%" class="results-table"> 
                <tr> 
                    <td> 
                        <div id="formBuilderPreviewEnrollmentData">
                            <p> NAME: <input class="required" name="NAME" type="text" /></p> <p> &#160;</p> 
                            <p> AGE: <input name="AGE" type="text" /></p> <p> &#160;</p> 
                            <p> ADDRESS:<textarea name="ADDRESS"></textarea></p> 
                        </div> 
                    </td> 
                </tr> 
            </table> 
            <br /> <br /> <br />
         </div>
    </form>
</html>

我在 IE 7 中收到此 JS 错误(在 Firefox 中运行良好)

4

1 回答 1

0

试试这个

<script>
        jQuery(document).ready(function()
        {
            jQuery('div#formBuilderPreviewEnrollmentData input[type!="hidden"]').attr("disabled", true)
        });
</script>

只是为了确保,您想要禁用不是 type="hidden" 的输入,或者您想要禁用在屏幕上不可见的输入(css 样式显示:无)。两者之间有很大的不同,jquery 选择器会有所不同。

于 2012-09-24T19:59:23.903 回答