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);
        }
      });
  });
});