如何在单击事件中调用jQuery AJAX？

Question

我创建了一个jQuery模型。

我试图在该模型内使用AJAX填充数据。

我获取了一个ID，并想使用AJAX来填充数据。

我应该如何在单击事件上调用AJAX？

当模型打开或加载时，是否有其他事件？

该模型只是显示和隐藏div。

- zod

---

哪个模态插件？Jquery-ui模态框？如果是的话，它确实有一个打开事件。需要澄清。 - redsquare

还有...获取id是什么意思？你从哪里获取它，在什么事件中 - 给出一些代码以提供上下文......阅读Jon Skeet的建议，了解如何提问 http://msmvps.com/blogs/jon_skeet/archive/2010/08/29/writing-the-perfect-question.aspx - redsquare

$('a.pop').click(function() { var popID = $(this).attr('rel'); //获取弹出窗口名称 var popURL = $(this).attr('href'); //获取弹出窗口链接 $.get("content.php", { ref:id},function(data){ alert("数据已加载: "+data ); } );我想在这次点击事件中调用那个ajax文件。如何操作？ - zod

Answer 1

只需使用：

JS：

$(document).ready(function(){
  $('a.pop').click(function() { 
    var popID = $(this).attr('rel');
    $.get('content.php', { ref:popID }, function(data) {
       $(popID+'Container').html(data);
       $(popID).dialog();
       alert('Load was performed.');
    });
    return false; // prevent default
  });
});

HTML:

<div id="example" class="flora" title="This is my title">
    I'm in a dialog!
    <div id="exampleContainer"></div>
</div>
<a href="#" id="clickingEvent" class="pop" rel="example">click to launch</a>

尽管我没有测试过，但在我看来，它应该可以工作...

- Garis M Suero

---

是的，它正在工作...我是jquery的新手..现在变得更好了。 我正在使用.get。 顺便问一下，在jquery中使用get和post有什么区别...？ 我知道php get post。我能否使用jqueryposy在不提交的情况下获取表单的变量？这是一个愚蠢的问题！！！ 我正在使用get，现在它正在工作。 - zod

GET和POST在JQUERY和PHP中是相同的，因为它们独立于任何语言，是http协议的一部分。请参阅此链接：http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html - Garis M Suero

Answer 2

你快要做到了，你需要阻止默认的操作，这个默认操作是跟随链接中的 href，所以请添加 event.preventDefault() 或者 return false，像这样：

$('a.pop').click(function(e) {                     //add e param
  var popID = $(this).attr('rel'),
      popURL = $(this).attr('href');
  $.get("content.php", { ref:id}, function(data) { //did you mean popID here?
    alert("Data Loaded: "+data ); 
  });
  e.preventDefault(); //or return false;           //prevent default action
});

- Nick Craver