Question

首先向大家致意。我对jquery和学习曲线相对较新。

我的脚本是这样的：

＆＃13;

<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js">
</script>

<script>
$(function () {
$('#content').find('#nav a').on('click', function (e) {
e.preventDefault();
var page = $(this).attr('href');
$('#content2').load(page);
});
});
$(function() >{
$('#content').find('#nav a').click(function() {
$('#nav a').removeClass('selected');
$(this).addClass('selected');		            
});
});
</script

＆＃13;

<div id="content">
 <embed type="image/svg+xml" src="x.svg" />
 <div id="svgfix">
     <embed type="image/svg+xml" src="1.svg" />
     <embed type="image/svg+xml" src="2.svg" />
     <embed type="image/svg+xml" src="3.svg" />
     <embed type="image/svg+xml" src="4.svg" />
     <embed type="image/svg+xml" src="5.svg" />
     <embed type="image/svg+xml" src="6.svg" />
 </div>
 <div id="nav">
      <a href="1.htm"><img type="image/svg+xml" src="1.svg" /></a>
      <a href="2.htm"><img type="image/svg+xml" src="2.svg" /></a>
      <a href="3.htm"><img type="image/svg+xml" src="3.svg" /></a>
      <a href="4.htm"><img type="image/svg+xml" src="4.svg" /></a>
      <a href="5.htm"><img type="image/svg+xml" src="5.svg" /></a>
      <a href="6.htm"><img type="image/svg+xml" src="6.svg" /></a>
 </div>
 </div>
<div id="content2"><h1></h1></div>

＆＃13;

该脚本运行良好。我唯一的问题，我希望第一页自动加载，第一个按钮被选中。我试图在这里找到一个解决方案并通过主题阅读，但没有任何效果如此。

脚本应该通过带有6个页面的导航栏单击加载，并且它会执行并且每个按钮都将被选中。但我希望在第一页加载时，自动选择第一个按钮并自动加载第一页。

我希望我的问题是可以理解的，并感谢你提前的时间和帮助...

Answer 1

您可以这样做：

创建一个函数，并在页面准备就绪和点击事件

时调用

$(function () {

function getPage(el){
var page = $(el).attr('href');
$('#content2').load(page);
$('#nav a').removeClass('selected');
$(el).addClass('selected'); 
}


 getPage($('#nav a:first-child'));//get the first page
$('#nav a').on('click', function (e) {
e.preventDefault();
     getPage($(this));            
});
});

Answer 2

尝试在创建事件侦听器后单击第一个链接

$('#nav a').first().click()

关于find()的快速说明。由于ID在页面上必须是唯一的，因此您可以跳过$('#content').find('#nav a')并使用$('#nav a')

Answer 3

试图理解你的问题 - 也许是这样的？

$( document ).ready( function() {
    var firstNav = $('#nav a').first();
    var page = firstNav.attr('href');
    $('#content2').load(page);
    firstNav.addClass('selected');
}

加载第一页onload和第一个导航按钮点击onload

3 个答案: