Javascript 隐藏/显示JS中的div不再工作-潜在冲突btw脚本

我过去常隐藏/显示div。不幸的是，由于某些原因，它不再工作了（我同时修改了代码中的一些内容）。。。你知道问题来自哪里吗？jsfiddle： 我认为下面两个脚本可能存在冲突：

function showonlyone(thechosenone) {
    $('.textzone').each(function(index) {
        if ($(this).attr("id") == thechosenone) {
            $(this).show(200);
        }
        else {
            $(this).hide(200);
        }
    });
}

$('.activity-title a').click(function(){
  $('.textzone').fadeOut(2000);
  var region = $(this).attr('data-region');    
  $('#' + region).fadeIn(2000);
})​

---

你有一些问题。您的

---

我从中的标记中假设，对于每个链接（

.activity title a

），都有一个

.textzone

）。我从这些锚中删除了

onclick

事件。这样，第一个链接对应于第一个

.textzone

：

<div id="source-container">
    <div id="source-region" class="textzone">
      <p><span class="activity-title">Interacting with the nature</span></p>
      <p>blablabla</p>
    </div>
    <div id="source-oursource" class="textzone">
        <p><span class="activity-title">Pure, pristine, and sustainable source</span></p>
        <p>blablabla</p>
    </div>
    <div class="source-title-box"><span class="activity-title"><a href="#">Our region</a></span></div>
    <div class="source-title-box"><span class="activity-title"><a href="#">Our source</a></span></div>
</div>​

---

在左侧，您选择将javascript包装在

onLoad

块中。将此更改为“无包裹体”-然后阅读有关范围：Hi mcpDesigns的内容。不幸的是，这在我的情况下不起作用（这是一个单页风格的网站，其中每个div都是一个页面）。使用您的代码是因为a href=“#”当我单击链接时，它会上升到页面顶部，但必须添加

返回false最后（忘记它）将停止href=“”的启动。谢谢-不幸的是仍然无法工作：-/您可以在“源代码”页面上看到一个实时版本。可能是因为我的js在哪里？（在js/scripts.js中）您的代码位于文档之外。ready
$（Document.ready（函数（）{''将它放在$（“body”）.queryLoader2（）；''}）<div id="source-container">
    <div id="source-region" class="textzone">
      <p><span class="activity-title">Interacting with the nature</span></p>
      <p>blablabla</p>
    </div>
    <div id="source-oursource" class="textzone">
        <p><span class="activity-title">Pure, pristine, and sustainable source</span></p>
        <p>blablabla</p>
    </div>
    <div class="source-title-box"><span class="activity-title"><a href="#">Our region</a></span></div>
    <div class="source-title-box"><span class="activity-title"><a href="#">Our source</a></span></div>
</div>​

var textZones = $(".textzone");
var anchors = $('.activity-title a').click(function(e){
    e.preventDefault();
    var index = anchors.index(this);
    textZones.filter(":visible").fadeOut(2000, null, function() {
        textZones.eq(index).fadeIn(2000);        
    });
})​