Question

我有以下表格：

<form class="uk-form">
  <label for="startDate">Start Date:</label>
    <input type="text"  id="startDate" data-uk-datepicker="{format:'YYYY-MM-DD'}">
  <label for="endDate">End Date:</label>
    <input type="text"  id="endDate" data-uk-datepicker="{format:'YYYY-MM-DD'}">
</form>

我需要的是在JQuery中使用.on（）改变其中一个数据贴图后调用JS函数。

我只使用一个代码来使用它：

$('#startDate').on('change', function() {

但是，我需要的是当其中一个更改为运行该函数时，有点像这样：

$('#startDate'||'#endDate' ).on('change', function() {

有什么想法吗？

Answer 1

或者你可以

y0[1]

所以你不必担心替换元素

Answer 2

要在多个元素上附加更改事件，您可以使用multiple selector。另一种可能性是使用class selector

在事件处理程序中，要获取触发事件的元素，可以使用event.target。

$(function () {
  // Multiple selector:
  // $('#startDate, #endDate').datepicker();
  // or, class selector:
  $(':text.dpClass').datepicker();
  
  //$('#startDate, #endDate').on('change', function(e) {
  $(':text.dpClass').on('change', function(e) {
    $('#log').text('Changed element is:' + e.target.id);
  });
});

<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<p id="log"></p>
<form class="uk-form">
    <label for="startDate">Start Date:</label>
    <input type="text"  id="startDate" class="dpClass" data-uk-datepicker="{format:'YYYY-MM-DD'}">
    <label for="endDate">End Date:</label>
    <input type="text"  id="endDate" class="dpClass" data-uk-datepicker="{format:'YYYY-MM-DD'}">
</form>

Answer 3

尝试：$('input').on('change', function () {

当然，如果您在页面上有更多输入，它也会为它们开火。因此，也许给两个选择器提供唯一的类，并将on处理程序添加到该类中。

Answer 4

为两个输入命名。试试这个：

$("input[name='someName']").on('change', function() {});

使用.on（）检测不同输入的变化

4 个答案: