JQuery变量没有延续到JavaScript

Question

我试图使用JQuery从一个URL的PHP​​获取变量,并在javascript中使用该变量来更改页面上的内容.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
      $.get('http://jsonp.jit.su/?url=http://5.175.191.73/alert.php', function(data){
      var alertstate=data.isit;
      alert('pretty awesome, eh? ' + alertstate);
      });
    </script>

    <script type="text/javascript">
    if (alertstate==1) {
    document.getElementById('theImg').src="http://upload.wikimedia.org/wikipedia/commons/e/e7/Alert.gif";
    play_single_sound(audiotag1);
    }
    </script>

代码一直在JQuery中使用警报,但是一旦我到达Javascript if语句,错误控制台就会告诉我alertstate没有定义.任何帮助将非常感激.

Answer 1

你有两个问题:

1. $.get是异步的,所以你调用 的地方$.get 启动 ajax调用,但是当ajax调用异步发生时你的代码继续.因此,$.get将在$.get完成之前运行代码.

2. 你的alertstate变量是你作为回调给出的函数中的变量$.get; 它不存在于你的第二个代码块中的代码中,它希望它是一个全局变量.

相反,把逻辑从你的第二个脚本到的$.get第一回调:

<script>
$.get('http://jsonp.jit.su/?url=http://5.175.191.73/alert.php', function(data){
  var alertstate=data.isit;
  alert('pretty awesome, eh? ' + alertstate);
  if (alertstate==1) {
      document.getElementById('theImg').src="http://upload.wikimedia.org/wikipedia/commons/e/e7/Alert.gif";
      play_single_sound(audiotag1);
  }
});
</script>

如果你真的,真的希望它们是分开的,你可以将所有内容包装在一个作用域函数中(以避免创建全局变量),使用一个变量,回调结束,并使用由此返回的promise $.get,如下所示:

<script>
(function() {
    var alertstate, promise;

    promise = $.get('http://jsonp.jit.su/?url=http://5.175.191.73/alert.php', function(data){
      alertstate=data.isit;
      alert('pretty awesome, eh? ' + alertstate);
    });

    promise.then(function() {
      if (alertstate==1) {
          document.getElementById('theImg').src="http://upload.wikimedia.org/wikipedia/commons/e/e7/Alert.gif";
          play_single_sound(audiotag1);
      }
    });
})();
</script>