0

我首先要说除了编辑和查找脚本教程之外，我几乎没有 JavaScript 经验。一段时间以来，我一直在我的网站上使用一个小的喊话框脚本。由于添加了新的插件和脚本，我发现了一个问题。

Shoutbox 将大约 10-15 行文本存储在一个文本文件中，显示它们并在它们进行时更新（ajax 样式）并在 15 之后删除。简单的小脚本。

现在 Shoutbox 不再加载文本，只是显示为空白。我试图利用 jQuery.noConflict(); 选项，但无济于事。它确实加载了该框，但是当点击提交（发布数据）（不涉及 SQL）时，什么也没有发生。如果我刷新它会显示在框中。所以我知道这与实时传递数据有关。

这是脚本（不大）

<script type="text/javascript">
    var count = 0;
    var files = 'application/widgets/nipunashoutbox/demos/jquery-shoutbox/';
    var lastTime = 0;

    function prepare(response) {
      var d = new Date();
      count++;
      d.setTime(response.time*1000);
      var mytime = d.getHours()+':'+d.getMinutes();
      var string = '<div class="shoutbox-list" id="list-'+count+'">'
          + '<span class="shoutbox-list-time">'+mytime+'</span>'
          + '<span class="shoutbox-list-nick">'+response.nickname+':</span>'
          + '<span class="shoutbox-list-message">'+response.message+'</span>'
          +'</div>';

      return string;
    }

    function success(response, status)  { 
      if(status == 'success') {
        lastTime = response.time;
        $('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />');
        $('#daddy-shoutbox-list').prepend(prepare(response));
        $('input[@name=message]').attr('value', '').focus();
        $('#list-'+count).fadeIn('slow');
        timeoutID = setTimeout(refresh, 3000);
      }
    }

    function validate(formData, jqForm, options) {
      for (var i=0; i < formData.length; i++) { 
          if (!formData[i].value) {
              alert('Please fill in all the fields'); 
              $('input[@name='+formData[i].name+']').css('background', 'red');
              return false; 
          } 
      } 
      $('#daddy-shoutbox-response').html('<img src="'+files+'images/loader.gif" />');
      clearTimeout(timeoutID);
    }

    function refresh() {
      $.getJSON(files+"daddy-shoutbox.php?action=view&time="+lastTime, function(json) {
        if(json.length) {
          for(i=0; i < json.length; i++) {
            $('#daddy-shoutbox-list').prepend(prepare(json[i]));
            $('#list-' + count).fadeIn('slow');
          }
          var j = i-1;
          lastTime = json[j].time;
        }
        //alert(lastTime);
      });
      timeoutID = setTimeout(refresh, 3000);
    }

    // wait for the DOM to be loaded 
    $(document).ready(function() { 
        var options = { 
          dataType:       'json',
          beforeSubmit:   validate,
          success:        success
        }; 
        $('#daddy-shoutbox-form').ajaxForm(options);
        timeoutID = setTimeout(refresh, 100);
    });

在查看多个网站（包括 stackoverflow 讨论）后，我尝试添加代码段 noConflict.jQuery(); 在第一个脚本行之后。

然后在将每个 $ 分配给 jQuery 之后，慢慢地用 jQuery 和/或不同的变量替换每个 $。我得到的最接近的是它会在加载更新时冻结，或者它会启动一个新页面回显：

{"response":"Good work","nickname":"myusername","message":".","time":1364101631}

目前正在寻求帮助，因为我很想再次使用它。如果我不能道歉，希望我已经能够解释得足够多，请让我知道我还应该包括什么。感谢您花时间阅读本文，感谢您的支持。

编辑

抱歉，我忘记在标题中包含被调用的脚本：

  <script type="text/javascript" src="application/widgets/nipunashoutbox/js/jquery.js"></script>
  <script type="text/javascript" src="application/widgets/nipunashoutbox/js/jquery.form.js"></script>
4

1 回答 1

1

您需要设置jQuery.noConflict();等于一个变量。从那里你可以更换它。无论您的聊天框在哪里调用，您都可以执行以下操作：

var j = jQuery.noConflict();
j(document).ready(function() {
    console.log('jQuery is loaded'); // lets you know jQuery has loaded
}

所以在你的情况下：

<script type="text/javascript">
    var j = jQuery.noConflict();
    var count = 0;
    var files = 'application/widgets/nipunashoutbox/demos/jquery-shoutbox/';
    // omitting some code...
    function success(response, status)  { 
      if(status == 'success') {
            lastTime = response.time;
            j('#daddy-shoutbox-response').html('<img src="'+files+'images/accept.png" />');
            j('#daddy-shoutbox-list').prepend(prepare(response));
            j('input[@name=message]').attr('value', '').focus();
            j('#list-'+count).fadeIn('slow');
            timeoutID = setTimeout(refresh, 3000);
      }
    }

    // omitting more code...
</script>

您将需要使用我上面描述的方法替换$to的每个实例。j希望这会有所帮助！这是一个工作演示！

于 2013-03-24T05:25:06.160 回答