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用于onblur()事件的 javascript 函数。

早些时候，我有一个带有唯一 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
}

就个人而言，我会避免使用内联事件处理程序，如onblur="...", 并使用addEventListener直接从 JavaScript 绑定处理程序。这将是朝着将逻辑、结构和呈现方式脱钩的方向迈出的一大步。

于 2012-12-20T10:51:38.710 回答