Question

时间仅插入第一个字段https://jsfiddle.net/cjy28u1o/中。我想根据选定选择的字段插入时间。

$('#time').click(function(){
  var time = new Date();                
  $('#time-holder').val(time.toTimeString());  
});

Answer 1

您可以使用{{3}}将聚焦的元素存储在变量中，然后在单击时设置其值。在这种情况下，还使用属性 class 代替 id 更有意义：

$(function(){
  var $focused;
  $('.time-holder').focusin(function(){
    $focused = $(this);
  });
  $('#time').click(function(){
    var time = new Date();
    if($focused != undefined)
      $focused.val(time.toTimeString()); 
    else
      alert('Not focused any element');
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" value="" class="time-holder">
<input type="text" value="" class="time-holder">
<input type="text" value="" class="time-holder">

<input type="button" value="time" name="timer" id="time">

Answer 2

在HTML DOM中，id是唯一的。

如果为多个元素设置相同的id，则DOM和jQuery将在具有指定id的第一个匹配元素上触发事件。

其余元素将被忽略。

您需要向所有元素添加类，因为多个元素可以具有同一类。

这样，您将获得所有文本字段的时间。

因此，您的代码现在已更正：

<input type="text" value="" id="time-holder" class="time-text">
<input type="text" value="" id="time-holder2" class="time-text">
<input type="text" value="" id="time-holder3" class="time-text">

<input type="button" value="time" name="timer" id="time">

和Javascript：

$(function(){
 $('#time').click(function(){
  var time = new Date();                
  $('.time-text').val(time.toTimeString());  
 });
 }
);

Answer 3

尝试

$(
    function(){
        let lastFocusEl=null;
        
        $('#time').click(function(){
                  var time = new Date();                     
                  if(lastFocusEl) lastFocusEl.value = time.toTimeString();  
        });
        
        let f = function() { lastFocusEl=this};
        $('#time-holder').focus(f);
        $('#time-holder2').focus(f);
        $('#time-holder3').focus(f);

    }  
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="text" value="" id="time-holder">
<input type="text" value="" id="time-holder2">
<input type="text" value="" id="time-holder3">

<input type="button" value="time" name="timer" id="time">

Answer 4

时间只在第一个字段上插入

之所以发生这种情况，是因为，您已为所有三个元素赋予了不同的ID。您仅将第一个元素作为目标。您应该改用class。试试这个，

<input type="text" value="" class="time-holder"> <input type="text" value="" class="time-holder"> <input type="text" value="" class="time-holder">

<input type="button" value="time" name="timer" id="time">


JS CODE:



$(
    function(){

        $('#time').click(function(){
                  var time = new Date();                
                  $('.time-holder').val(time.toTimeString());  
        });

    }
);

Answer 5

我会听 focus 事件，然后将时间设置为最后一个焦点元素。

$('input[type="text"]').focus(function(){
    this.dataset.selected = true;
});
$('#time').click(function(){
          var time = new Date();
          var selectInput = $('[data-selected="true"]');
          selectInput.val(time.toTimeString());  
});

仅在选中时在字段中插入时间，然后单击

5 个答案: