0

私はこのhtmlコードを持っています:

<div id="jiraTicketAccordion">
 <div>
   <h3><a href="#">key</a></h3>
   <div>
     <form>
        <div id="jiraTable">
      <table>
        <tr>
           <td class="label"><label for="arrival">ARRIVAL :</label></td>

           <td><input type="text" name="arrival" class="arrival"  
                     onblur="checkTime(this.value);"/></td>

           <td class="label"><label for="newarrival">NEW ARRIVAL :</label></td>

          <td><input type="text" name="newarrival" class="arrival"  
                     onblur="checkTime(this.value);"/></td>

        </tr>
      </table>
     </form>
    </div>
  </div>
</div><!-- end of accordion div -->

ご覧のとおり、その入力ボックスにイベントcheckTime用のJavaScript 関数があります。onblur()

以前は、一意の ID を持つテキスト ボックスがあったのでdocument.getElementById、JavaScript 関数でアクセスするために使用しました。

しかし、今では同じ構造のアコーディオンがたくさんあるので、多数になる可能性があるため、一意の ID を使用したくありません。

これで、その検証が必要なすべてのテキスト ボックスのクラスができました。

しかし、今まで使っていた JavaScript 関数を変更する必要がありdocument.getElementByIdます。

jqueryでクラスごとに要素を選択できることは知っていますが、それも試しましたが、必要な結果が得られませんでした。

これは私がjqueryで試したことです：

function checkTime(dateTime){
    alert("inside  check time");
    var errorMsg="";
    regex = /^(\d{2})\/(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)\/\d{2} \d{2}:\d{2} [AP]M$/;
    if(dateTime != ''){
    if(!regex.test(dateTime)){
             errorMsg = "Please enter date and time in the format: \n dd/MMM/YY HH:MM AM/PM";
         alert(errorMsg);   
    //how to make the element that called this function to 
    //blank value it it failed validation
    }
     }
}

テキスト ボックスの値を操作できるように、このメソッドを呼び出した要素にアクセスしたかったのです。
また、その関数内の同じアコーディオンで、クラスごとに他の要素にアクセスしたいと考えていcheckDateます。

テキストボックスを空白にする方法がわかりません。検証に失敗しました。

以前に id を持っていたとき、次のようにしていました：

document.getElementById('arrival').value='';
4

1 に答える 1

4

現在のコードからの最短パスは、値の代わりに要素を渡すだけです:

onblur="checkTime(this);"

次に、関数で：

function checkTime(el){
    var dateTime = el.value;
    // rest of function
}

個人的には、 のようなインライン イベント ハンドラーの使用は避け、JavaScript から直接ハンドラーをバインドするためにonblur="..."使用します。addEventListenerこれは、ロジック、構造、およびプレゼンテーションを分離するための一歩です。

于 2012-12-20T10:51:38.710 に答える