1

私は日付ピッカーjsを使用しています。
終了日が変更されたときに検証を設定したいのですが、検証が設定されます。

HTML :

> <table width="52%" height="216" border="0"align="center">   <tr
> class="font_style">
>     <td height="30" valign="top">Academic Start Date</td>
>     <td width="51%" valign="top"><input name="txt_ACStart" type="text" id="txt_ACStart" readonly="readonly" /></td>   </tr>   <tr
> class="font_style">
>     <td height="30" valign="top">Academic End Date</td>
>     <td valign="top"><p>
>       <input name="txt_ACEnd" type="text" id="txt_ACEnd" readonly="readonly" />
>     </p>
>     <div id="validate_AC" style="display:none">End date must be higher than Start date</div></td>   </tr>   <tr class="font_style">
>     <td height="30" valign="top">Attendance Start Date</td>
>     <td valign="top"><span class="style_table_elm">
>       <input name="txt_ATStart" type="text" id="txt_ATStart" readonly="readonly" />
>     </span></td>   </tr>   <tr class="font_style">
>     <td height="30" valign="top">Attendance End Date</td>
>     <td valign="top"><p class="style_table_elm">
>       <input name="txt_ATEnd" type="text" id="txt_ATEnd" readonly="readonly" />
>     </p>
>     <div id="validate_AS" style="display:none">End date must be higher than Start date</div></td>   </tr>   <tr class="font_style">
>     <td height="30"><span class="style_table_elm">
>       <input type="checkbox" name="chk_weekendvar" id="chk_weekendvar" />
>       <strong>Attendance on Mon - Sat</strong>
>     </span></td>
>     <td>&nbsp;</td>   </tr>   <tr class="font_style">
>     <td height="30" colspan="2"><blockquote>
>       <blockquote>
>         <blockquote>
>           <blockquote>
>             <p>
>               <input type="submit" name="btn_save" id="btn_save" value="Save" action="toggle()" />
>             </p>
>           </blockquote>
>         </blockquote>
>       </blockquote>
>     </blockquote></td>   </tr> </table>

JavaScript：

<script type="text/javascript">
    var valid1 = document.getElementById("validate_AC");
    var valid2 = document.getElementById("validate_AT");
    var ACdate1 ="";
    var ACdate2 ="";
    var ATdate3 ="";
    var ATdate4 = "";

    $(document).ready(function(){
        $("txt_ACEnd").bind("change",toggle1);
        $("txt_ATEnd").bind("change",toggle2);
    });

    function toggle1(){
        ACdate1 = document.getElementById("txt_ACStart").value();
        ACdate2 = document.getElementById("txt_ACEnd").value();


        if(ACdate1 > ACdate2)
        {
            valid1.style.display = "block";
        }
        else
        {
            valid1.style.display = "none";
        }

    }

    function toggle2()  {
        ATdate3 = document.getElementById("txt_ATStart").value();
        ATdate4 = document.getElementById("txt_ATEnd").value();

        if(ATdate3 > ATdate4)
          {
              valid2.style.display = "block";
          }
          else
          {
              valid2.style.display = "none";
          }

    }

txt_ACEndが変更されたときにtoggle1関数が実行され、txt_ATEndが変更されたときにtoggle2関数が実行されるようにするにはどうすればよい
ですか？

トグル1とトグル2の機能は正しいですか、それとも実行されませんか？

4

2 に答える 2

0

これをチェックして：

$(document).ready(function(){
    $("txt_ACEnd").bind("change",toggle1);
    $("txt_ATEnd").bind("change",toggle2);
    //^------------You have to use jQuery way to select the selectors-------
});

そしてそれはこのようになるはずです：

$(document).ready(function(){
    $("#txt_ACEnd").bind("change",toggle1);
    $("#txt_ATEnd").bind("change",toggle2);
});

use '#' for id capture
use '.' for class capture
于 2012-11-06T05:53:30.863 に答える
-1

このサンプルを試すことができます。要素の値が変更された場合に関数を呼び出す方法について説明します。
つまり、入力変更リスナーを実装します。

http://jsbin.com/afudor/1/edit

于 2012-11-06T05:52:22.893 に答える