jquery link 使用 onclick 标记 href 需要点击两次才能加载 ajax

Question

我正在编写一个 ajax 页面，当触发 jquery 选择器 ID 时，它通过 onclick 传递参数并执行 $.getJSON 然后 returns div。它可以工作，但需要单击两次才能加载内容！假设只需单击一下即可加载！任何帮助，将不胜感激。这是代码：

function services(theid) {

$('#open').on('click', function(){


   $.getJSON('process_serv.php',{thevar: theid}, function(data){

    $('.services').html(data.name + "-" +  data.charge);
   });
 });


  }

<a href="#"onclick="services('<?php echo $id?>'); return false"       
id="open" >hi</a> 
<div class="services">
</div>
<div class="times">
</div>
<div class="details">

<?php
$con = new mysqli("localhost", "root", "root", "labookin");

if(isset($_GET['thevar'])){

$id = $_GET['thevar'];

$query = "SELECT * FROM services WHERE bizid='$id'";

$the = $con->query($query);

$row = $the->fetch_assoc();

echo json_encode($row);


}
 ?>

Answer 1

您在第一次点击时附加点击处理程序，然后在第二次点击时运行它。将您的 JS 代码更改为：

function services(theid) {
    $.getJSON('process_serv.php',{thevar: theid}, function(data){
        $('.services').html(data.name + "-" +  data.charge);
    });
}

jquery link 使用 onclick 标记 href 需要点击两次才能加载 ajax

jquery link tag href with onclick requires two clicks to load ajax

html

javascript

ajax

jquery

onclick