WordPress页面中的Ajax

Question

我正在尝试在WordPress页面中使用以下ajax jquery：

  1.  <script>
  2.  $(document).ready(function(){
  3.     $("button").click(function(){
  4.      $.ajax({
  5.          method: 'GET',
  6.          url: "http:Sample.url.com",}).done(function (data)
  7.              {
  8.            var f_table= "";
  9.            for (var i = 0; i < data.unittopics.topics.length; i++) {
  10.           f_table+= "<tr><td>" +data.unittopics.topics[i].name+  "</td><td>" +data.unittopics.topics[i].description+ "</td><td>" + "<a id=" +'Frac_Link'+i+ " href='#'>" +'Click here'+  "</td></tr>";
  11.           alert("#div"+data.unittopics.topics[i].id);
            }
  12.  $("#Frac_Table").append(f_table);
  13.       for (var x = 0; x < data.unittopics.topics.length; x++) 
 {
  14.   $("#Frac_Link"+x).attr('href', data.unittopics.topics[x].externalUrl);
  alert("working");
 }

});
});
});
</script>

我已经在w3school测试环境中测试了这个jQuery，它可以完美工作，但是当我将它放入WordPress时，它在第10行上抛出了以下错误Invalid or unexpected token 。有没有简单的方法来解决此问题？

谢谢。

Answer 1

我遇到了同样的问题，我将$更改为对我有用的jQuery

Answer 2

WordPress在无冲突模式下与jQuery一起运行，因此将$的使用替换为jQuery ，因此可以将$所有实例替换$ jQuery ，或者...

var $ = jQuery;

那应该解决它。

Answer 3

以上所有都是正确的，并解决了我不知道的另一个问题。 但是我发布的问题已解决，我在jQuery中分离了<tr><td>标签。

解

jQuery(document).ready(function(){
  jQuery("#frac_btn").one('click', function() {
    jQuery.ajax({
      method: 'GET',
      url: 'http:Sample.url.com'
    }).done(
      function (data) {
        var f_table= "";

        for (var i = 0; i < data.unittopics.topics.length; i++) {
          f_table += '<tr' + '><td' + '>' +
            data.unittopics.topics[i].name + '</td' + '><td' + '>' +
            data.unittopics.topics[i].description + '</td' + '><td' + '>' +
            '<a id=' + 'Frac_Link' + i + " href='#'>" + 'Click here' +
            '</td' + '></tr' + '>';
        }

        jQuery("#Frac_Table").append(f_table);

        for (var x = 0; x < data.unittopics.topics.length; x++) {
          jQuery('#Frac_Link' + x).attr('href', data.unittopics.topics[x].externalUrl);
        }
      });
  });
});