.jspx中的Javascript

Question

我有一个输入框的楼层号码，我想禁用其中的第一个字符。所以我使用这个javascript：

   <script type="text/javascript">
 //<![CDATA[        
$("#_floorNumber_id).on("keydown", function(e) {
    if (($(this).get(0).selectionStart == 0 && (e.keyCode < 35 || e.keyCode > 40))
        || ($(this).get(0).selectionStart == 1 && e.keyCode == 8)) {
        return false;
    }
});

$("#_floorNumber_id").bind("contextmenu", function(e) {
    e.preventDefault();
});
    //]]>

    </script>

但剧本似乎没有被读过。我试着向它发出警告，但警报也没有显示出来。这就是我的.jspx的样子：

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<div xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:field="urn:jsptagdir:/WEB-INF/tags/form/fields" xmlns:form="urn:jsptagdir:/WEB-INF/tags/form" xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:spring="http://www.springframework.org/tags" version="2.0">
    <jsp:directive.page contentType="text/html;charset=UTF-8"/>
    <jsp:output omit-xml-declaration="yes"/>

   <script type="text/javascript">
 //<![CDATA[        
$("#_floorNumber_id").on("keydown", function(e) {
    if (($(this).get(0).selectionStart == 0 &amp;&amp; (e.keyCode < 35 || e.keyCode > 40))
        || ($(this).get(0).selectionStart == 1 &amp;&amp; e.keyCode == 8)) {
        return false;
    }
});

$("#_floorNumber_id").bind("contextmenu", function(e) {
    e.preventDefault();
});
    //]]>

    </script>

    <div id="wrapper">
        <div class="container-fluid">
            <div>
                <ol class="breadcrumb">
                  <li class="disabled"><a>Floor</a></li>
                  <li><a href="/hms/floors?page=1&amp;size=${empty param.size ? 10 : param.size}">List of Floors</a></li>
                  <li class="active"><span>Register Floor</span></li>
                 </ol>
            </div>

                  <form:create id="fc_hms_domain_Floor" modelAttribute="floor" path="/floors" render="${empty dependencies}" >
                      <field:inputFloor field="floorNumber" id="c_hms_domain_Floor_floorNumber" max="30" min="3" required="true" value="${floor.floorNumber}"/>
                      <field:textarea field="description" id="c_hms_domain_Floor_description" required="true" />
                      <field:textarea field="floorComments" id="c_hms_domain_Floor_floorComments" required="true" />
                  </form:create>
                  <form:dependency dependencies="${dependencies}" id="d_hms_domain_Floor" render="${not empty dependencies}" />

           </div>   
       </div>   
</div>

我只是在.jspx中使用javascript的新手。我希望有人能帮我。谢谢。

Answer 1

看起来，在将元素添加到页面之前，脚本就会运行。这就像在一个人进入房间之前叫他们的名字一样。将找不到该元素。无论脚本需要在元素后面，您都需要使用文档就绪、窗口加载或事件委派。

之后：

<input>
<script>
   //your code here
</script>

文件准备就绪

$( function(){
   //your code here
});

满载

$(window).on("load" , function() {
   //your code here
});

或事件委托

$(document).on("click", "#_floorNumber_id", "keydown", function(e){
  console.log(e.which);
});