javascript - 使用 HTML Div 的 Javascript/Jquery onClick 不起作用

Question

当我点击我的“php1”div 时，它什么也不做。

location.reload() 是一个占位符，只是了解 onClick 是否有效的简单方法。

    <div class="php-task">
      <h1>PHP</h1>
      <div id="php1" class="text">
        <p>Display/setvars</p>
      </div>
    </div>

    $("#php1").click(function (e) { 
      e.preventDefault();
    
      $.ajax({
        type: "POST",
        url: "php/pagehandler.php",
        data: {page: "task",task: 1},
        success: function (response) {
          location.reload();
        }
      }); 
    });

标签： javascripthtmljqueryajax

Answer 1

我认为在您有多个 div 的情况下，php1,php2,php3...最好使用类来附加点击事件：

$(function() {
  $(".php-task .text").click(function(e) {
    e.preventDefault();

    console.log('Task with id : ' + this.id + ' clicked.');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="php-task">
  <h1>PHP</h1>
  <div id="php1" class="text">
    <p>Display/setvars</p>
  </div>
</div>
<div class="php-task">
  <h1>PHP</h1>
  <div id="php2" class="text">
    <p>Display/setvars</p>
  </div>
</div>
<div class="php-task">
  <h1>PHP</h1>
  <div id="php3" class="text">
    <p>Display/setvars</p>
  </div>
</div><br><br><br>