更改jQuery加载代码

嗨，有人可以帮助我改变这种编码我试图删除href页面＃.html加载并使用预加载li与文本来填充单击链接时的sclit div。更改jQuery加载代码

<div id="sclit"></div> 
<!-- old code 
<a href="page1.html" class="para">Sci Lit 1</a> 
<a href="page2.html" class="para">Sci Lit 2</a> 
<a href="page3.html" class="para">Sci Lit 3</a> 
--> 

<ul style="display:none"> 
<li class="page1"> text text </li> 
<li class="page2"> text text </li> 
<li class="page3"> text text </li> 
</ul> 

<script> 
jQuery(document).ready(function() { 
    jQuery(".para").click(function() { 
     // jQuery("#sclit").load(jQuery(this).attr('href')); // old code 
     jQuery("#sclit").load(jQuery(this).attr('li')); 
    }); 
}); 
</script>

来源

2011-05-23 acctman

您是否试图将每个锚中的href页面预加载到'li'中，然后在单击'a'时将它们交换出来？ – hunter 2011-05-23 14:45:12

我觉得你只是想消除.load在这种情况下，你可以做这样的事情：

http://jsfiddle.net/GgMee/

将html标记更改为：

<div id="sclit"></div> 

<a href="javascript:void(0)" class="para">Sci Lit 1</a> 
<div class="details">text for sci lit 1</div> 

<a href="javascript:void(0)" class="para">Sci Lit 2</a> 
<div class="details">text for sci lit 2</div> 

<a href="javascript:void(0)" class="para">Sci Lit 3</a> 
<div class="details">text for sci lit 3</div>

其中隐藏每个链接后的details div，并包含单击该链接时要显示的文本。

然后jQuery是这样的：

$(function(){ 
    $(".para").click(function(){ 
     $("#sclit").text($(this).next(".details").text()); 
    }); 
});

点击一个链接时，发现它后details DIV，并把文字从入sclit格。

来源

2011-05-23 14:51:45

快速问题，我将如何预先载入Sci Lit 1？ – acctman 2011-05-23 16:08:15

如果我正确理解你想要的东西，我上面发布的html就是你想从后端返回的东西。这样，当它们点击并且不需要ajax时，它就会在那里。如果您希望它默认为sci lit的文本，那么您可以在创建html时将其从后端填充，或者在准备好的文档中将其设置为您的javascript。 – 2011-05-23 17:49:06

使用文档准备就需要jquery吧？ – acctman 2011-05-25 21:26:38

jQuery(function() { 
    // preload all li's with the content of each anchors href beforehand 
    jQuery(".para").each(function(e) { 
     var $li = $("<li />").load($(this).attr('href')); 
     $("ul").append($li); 
    }); 

    // now that data is already present in the li's (and if the indexes match up 
    // which they should if your html is accurate) swap the divs html with 
    // the content of the corresponding li 
    jQuery(".para").click(function(e) { 
     e.preventDefault(); 
     jQuery("#sclit").html($("ul li:eq(" + $(this).index() + ")")); 
    }); 
});

来源

2011-05-23 14:43:22 hunter

我不知道如果我理解正确的问题，但如果我没看错的要求是

用户点击一个L1标签
股利sclit取文本来自li标签。

如果这是正确的，那么这应该这样做

<div id="sclit"></div> 
<!-- old code 
<a href="page1.html" class="para">Sci Lit 1</a> 
<a href="page2.html" class="para">Sci Lit 2</a> 
<a href="page3.html" class="para">Sci Lit 3</a> 
--> 

<ul style="display:none"> 
<li class="page1"> text text </li> 
<li class="page2"> text text </li> 
<li class="page3"> text text </li> 
</ul> 

<script> 
jQuery(document).ready(function() { 
    jQuery("li").click(function() { 
     // jQuery("#sclit").load(jQuery(this).attr('href')); // old code 
     jQuery("#sclit").html(jQuery(this).text()); 
    }); 
}); 
</script>

来源

2011-05-23 14:46:52 Nikhil

更改jQuery加载代码

回答

相关问题