duanjian4150
duanjian4150
2018-03-23 19:19

Javascript在Wordpress index.html中处理PHP导致加载问题,而不是匹配小提琴代码

I have a wordpress site where I have retrieved data from the wordpress database using a php script called within index.php.

I want to handle the data acquired through the php script with a JavaScript/jQuery script that will format the data.

The issue is that the code I am using works in JS Fiddle ( https://jsfiddle.net/ocmLe17o/6/) works; it logs the correct raw variable from the HTML and parses it successfully. However, in Wordpress when I include the .js file running the said code in the functions.php file and call the php script, I get no an undefined output console.logged as the svg_links_parsed variable. ("VM691:1 Uncaught SyntaxError: Unexpected token u in JSON at position 0 at JSON.parse ()"

I suspect the issue may be with the order in which Wordpress loads scripts, and I've tried enqueueing the script after the php including, but I get the same issue.

TL;DR: It works in Fiddle but not wordpress, how do I guarantee the script fires after the php code is inserted if in Wordpress the header is called first and the script is in the header?

Example HTML:

<!DOCTYPE HTML>
<body>
<input type='hidden' id='cover_links' value='["img\/TTEST_1.svg","img\foo.svg","img\/Bar.svg","img\/Derp.svg"]'>
</body>

Javascript:

var raw_src = jQuery("input").val();

console.log(raw_src); //In Fiddle this logs the input string, in Wordpress it's Undefined!

var svg_links_parsed = JSON.parse(raw_src);

document.write(svg_links_parsed);
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • duanpa5237 duanpa5237 3年前

    You may want to wait until the page is loaded to be sure the script runs after the input tag is loaded into the dom. Stick your code in a document ready :

    $( document ).ready(function() {
      // do stuff after page is loaded. 
    });
    
    点赞 评论 复制链接分享