jQuery 不在现场工作，但在 jsfiddle 上工作答案

【问题标题】：jQuery not working on site, but works on jsfiddlejQuery 不在现场工作，但在 jsfiddle 上工作
【发布时间】：2013-06-02 05:04:07
【问题描述】：

以下由 stefanz 编写的代码在 jsfiddle 上运行良好，但我无法在我的本地 wordpress 网站上运行..

这里是小提琴：http://fiddle.jshell.net/9ae3T/

代码如下：

<ul class="tabs js-view-mode">
  <li><a href="#list">List</a></li>
  <li><a href="#grid">Grid</a></li>
  <li><a href="#full">Full</a></li>
</ul>

<section id="viewMode">
  <div id="list">here is list mode content</div>
  <div id="grid">here is grid mode content</div>
  <div id="full">here is full mode content</div>
</section>


$(document).ready(function(){
  var wrap = $('#viewMode'),
      viewMode = $.cookie( 'view-mode' );
  wrap.children().hide();

  $('.js-view-mode').on( 'click', 'a',function( e ){
    e.preventDefault();
    var t = $(this),
        type = t.attr('href');

    $(type).fadeIn()
      .siblings().fadeOut();

    viewMode = $.cookie( 'view-mode', type );

  });

  if ( viewMode ) {
    $('.js-view-mode a[href='+ viewMode +']').trigger('click');
  } else {
    $('.js-view-mode li:first a').trigger( 'click' );
  }

});

有人有建议吗？这就是我的想法（viewmode.js 是上面的代码）：

<script language="javascript" type="text/javascript" src="<?php echo bloginfo('stylesheet_directory') ?>/js/viewmode.js"></script>
        <script language="javascript" type="text/javascript" src="<?php echo bloginfo('stylesheet_directory') ?>/js/cookie.js"></script>


        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>

【问题讨论】：

我猜是因为它导致了冲突..尝试使用jQuery而不是$或使用jquery没有冲突
成功了！！经过数小时的脑出血挫折，这就是我所需要的。

标签： jquery

【解决方案1】：

包含 jQuerybefore 包含您自己的文件，因为它显然使用了 jQuery。

另外我希望你意识到你不能把 HTML 放在 .js 文件中。

【讨论】：

好点，但这并没有成功。它可能无法正常工作的任何其他原因？
没有更多的想法。是时候打开开发者控制台（Chrome 中的 Ctrl+Shift+C）并查找错误了。
感谢您的帮助，我不需要冲突

【解决方案2】：

您正在加载的是 jQuery 之前的 javascript 文件，这是一个硬依赖..

首先包含 jQuery，然后是您的文件。

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js">
 </script>
 // include jQuery First
<script language="javascript" type="text/javascript" 
     src="<?php echo bloginfo('stylesheet_directory') ?>/js/viewmode.js">
</script>
 <script language="javascript" type="text/javascript" 
     src="<?php echo bloginfo('stylesheet_directory') ?>/js/cookie.js">
</script>

【讨论】：