1

私は長い間試みてきました、これは問題です:

テキストボックス付きのビューがあり、JQueryが機能しているかどうかを確認するために実行しようとしているのは、そのテキストボックスの値が0より長い場合にアラートメッセージを表示することだけです。これが私です現時点で取得:

registers/registration.html.erb

<script>
    $('input[name="Card_ID"]').keyup(function(){
        if (this.value.length > 0) {
            alert("TEST");}
    });
</script>

<table border="1">
  <%= text_field_tag 'Card_ID',nil,  :autofocus => true %>
  <tr><td>Present</td>
    <td>University ID</td>
    <td>First Name</td>
    <td>Last Name</td>
    <td>Time of Arrival</td>
  </tr>
  <tr>
  <% @studentregister.each do |t| %>
<%= simple_form_for t do |streg| %>
      <td><div class="present"><%= streg.check_box :present, :onChange => "submit()"%></div>
        <%= streg.submit :style => 'display: none' %></td>
            <td><%= streg.label Student.find(t.student_id).university_id %></td>
            <td><%= streg.label Student.find(t.student_id).first_name %></td>
            <td><%= streg.label Student.find(t.student_id).last_name %></td>
            <% if t.time_of_arrival %>
            <td><%= streg.label t.time_of_arrival.strftime('%H:%M:%S%P')%></td>
                <% else %>
            <td><%= streg.label " "%></td>
                <% end %>
             </tr>
    <% end %>
    <% end %>
</table>

テストの目的で、同じコード(CoffeeScript内)を関連JS.COFFEEファイルに入れて、機能するかどうかを確認しました。

registers.js.coffee

$("input[type=text]").keyup ->
  alert "TEST"  if @value.length > 0

しかし、いいえ、それでも機能しません。alert "Test"を表示しようとしたとき、またはalert("Test")ページが読み込まれたときに機能するため、機能しないのはこのコードだけです。

何か案は?

編集:それがどのように見えるかを示し、HTML要素を表示するためにいくつかのHTMLソースコードを追加しました:

  <div id="main" role="main">
      <div class="container">
        <div class="content">
           <div class="row">
            <div class="span12">

              <script>
    $('input[name="Card_ID"]').keyup(function(){
        if (this.value.length > 0) {
            alert("TEST");}
    });
</script>

<table border="1">
  <input autofocus="autofocus" id="Card_ID" name="Card_ID" type="text" />
      <tr><td>Present</td>
        <td>University ID</td>
        <td>First Name</td>
        <td>Last Name</td>
        <td>Time of Arrival</td>
      </tr>
  <tr>
<form accept-charset="UTF-8" action="/student_registers/9" class="simple_form edit_student_register" id="edit_student_register_9" method="post" novalidate="novalidate">
<div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" />
<input name="_method" type="hidden" value="put" />
<input name="authenticity_token"   type="hidden" value="c8B0JGs4ZLVILa4a4r4PJJrD/zFcLCDhTLscBKHbFeE=" /></div>
      <td><div class="present">
<input name="student_register[present]" type="hidden" value="0" />
<input checked="checked" id="student_register_present" name="student_register[present]" onChange="submit()" type="checkbox" value="1" /></div>
        <input name="commit" style="display: none" type="submit" value="Update Student register" /></td>
            <td><label class="string optional control-label" for="student_register_w122344112">W122344112</label></td>
            <td><label class="string optional control-label" for="student_register_Daniel">Daniel</label></td>
            <td><label class="string optional control-label" for="student_register_Smith">Smith</label></td>
            <td><label class="string optional control-label" for="student_register_ "> </label></td>
             </tr>
4

1 に答える 1

1

ready()これはjQuery関数の仕事のように見えます。次のコード行の中にJavaScript(上記のコードから)を入れてみてください$(function() { ... });

このような:

$(function() {
    $('input[name="Card_ID"]').keyup(function(){
        if (this.value.length > 0) {
            alert("TEST");
        }
    });
});

これを行うことにより、jQueryready()関数は(少なくとも) DOMに、ページでJavaScriptを実行する(または使用する準備をする)前にロードして準備を整える機会を与えます。

于 2013-03-18T21:38:05.483 に答える