Question

我有4个按钮，我希望能够通过空格键检测单击或标签选择的按钮。我无法让我的按钮提醒。有人请帮我检测一下哪个按钮被选中了吗？

def foo():
     with open('myFile.csv', newline='') as csvfile:
     ......

也尝试过：

<div id="searchoptions">
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="accountNumber" name="accountNumber" value="accountNumber">PROPERTY ID</button>
        </div>
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="name" name="name" value="name">OWNER NAME</button>
        </div>
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="location" name="location" value="location">PROPERTY ADDRESS</button>
        </div>
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="billingAddress" name="billingAddress" value="billingAddress">BILLING ADDRESS</button>
        </div>
    </div>

$(document).on('click', '#accountNumber, #name, #location, #billingAddress,', function() {

var value = $(this).val();
alert(value);
    if (value === "accountNumber") {

        alert("accountNumber");

    } else if (value === "name"){

        alert("name");

    } else if (value === "location"){

        alert("location");

    } else if (value === "billingAddress"){

        alert("billingAddress");

    }

});

Answer 1

删除选择器字符串处的尾随逗号,。您还可以使用选择器#searchoptions button

$(document).on('click', '#searchoptions button', function() {

   console.log(this.value)

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="searchoptions">
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="accountNumber" name="accountNumber" value="accountNumber">PROPERTY ID</button>
  </div>
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="name" name="name" value="name">OWNER NAME</button>
  </div>
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="location" name="location" value="location">PROPERTY ADDRESS</button>
  </div>
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="billingAddress" name="billingAddress" value="billingAddress">BILLING ADDRESS</button>
  </div>
</div>

Answer 2

另一种方法怎么样？

$(document).ready(function(){
    $('button').click(function(){ 
       alert($(this).attr('name')); 
    });
});

看看this one

Answer 3

也许这可以帮到你：

＆＃13;

$(":button").click(function(){
 console.log($(this).val());
});
/* or you can use this: 
$("#searchoptions").on("click",":button",function(){
console.log($(this).val());
});
*/

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="searchoptions">
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="accountNumber" name="accountNumber" value="accountNumber">PROPERTY ID</button>
        </div>
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="name" name="name" value="name">OWNER NAME</button>
        </div>
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="location" name="location" value="location">PROPERTY ADDRESS</button>
        </div>
        <div class="col-sm-3">
            <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="billingAddress" name="billingAddress" value="billingAddress">BILLING ADDRESS</button>
        </div>
    </div>

＆＃13;

Answer 4

这是一种方式。我创建了一个命名处理程序，以防您出于任何原因需要删除事件侦听器，并使类似的click和keydown事件更加清晰。

我将您的活动范围缩小到了id =＆＃39; searchoptions＆＃39; div提高性能并将两种事件类型发送到同一个处理函数。

您还可以使用e.target.whateverAttribute。

来定位任何其他按钮属性

＆＃13;

$('#searchoptions button').on('click', handlerFunc);
$('#searchoptions button').on('keydown', handlerFunc);

function handlerFunc(e) {
  const eType = e.originalEvent.type;

  if (eType === 'click' || e.keyCode == 13) {
    const id = e.target.id;
    alert(id);
  }
  e.stopPropagation();
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="searchoptions">
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="accountNumber" name="accountNumber" value="accountNumber">PROPERTY ID</button>
  </div>
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="name" name="name" value="name">OWNER NAME</button>
  </div>
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="location" name="location" value="location">PROPERTY ADDRESS</button>
  </div>
  <div class="col-sm-3">
    <button type="button" class="btn-u btn-default input-sm margin-bottom-10" id="billingAddress" name="billingAddress" value="billingAddress">BILLING ADDRESS</button>
  </div>
</div>

＆＃13;

我删除了if语句，只使用了alert（id），因为它提供了相同的输出。如果您想要与一组字符串进行比较，您还可以缩短语法：

var output = id == 'accountNumber' ? 'accountNumber'
    : id == 'name' ? 'name'
    : id == 'location' ? 'location'
    : id == 'billingAddress' ? 'billingAddress'
    : null;

//if output is truthy, execute alert
(output && alert(output));

Answer 5

如果有其他人想要这样做。我想通了。

$(document).on('click', 'button', function() {

    var value = $(this).val();

    if (value === "accountNumber") {

        alert("accountNumber");

    } else if (value === "name"){

        alert("name");

    } else if (value === "location"){

        alert("location");

    } else if (value === "billingAddress"){

        alert("billingAddress");

    }

});

单击或选中的jQuery选择的通知按钮

5 个答案: