Question

我首先要说的是，除了编辑和查找脚本教程之外，我几乎没有任何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>

Answer 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>

您需要使用我在上面描述的方法将$的每个实例替换为j。希望这有帮助！ Here is a working demo!

无法让jQuery.noConflict正常工作

1 个答案: