jQuery Button ID选择器不起作用

时间:2018-08-26 17:28:22

标签: jquery html

我有多个按钮可以执行不同的查询。但是,尽管按钮ID被用作选择器,但HTML并未捕获事件。我想隐藏它并使用display blcok显示另一个按钮

$("#del1").click(function(){
  var del = document.getElementById("del1");
	var confdel = document.getElementById("confdel1");
	del.style.display="none";
	confdel.style.display="block";
});
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>

  <button form="" class="btn btn-success" id="send1"  style="float:right; width:35%;padding: 0.5rem 0.5rem;">Send</button>
  <button form="" class="btn btn-warning" id="request1"  style="float:right; width:37%;padding: 0.5rem 0.5rem;">Request</button>
  <button form="" class="btn btn-danger" id="del1"  style="float:right; width:23.5%;padding: 0.5rem 0.5rem;">Delete</button>
  <button form="" class="btn btn-danger" id="confdel1"  style="float:right; width:23.5%;padding: 0.5rem 0.5rem;display:none;">ConfirmDelete</button>

</body>
</html>

1 个答案:

答案 0 :(得分:1)

尝试使用jQuery,并使用ID进行一些清理。如果是ID,请在选择器中使用#。由于您单击了#del1,因此只能在方法中使用$(this)。 jQuery具有show / hide方法,可以简化css的处理。

$('#del1').click(function(){
  $(this).hide();
  $('#confdel1').show();
});