我使用 jQuery 插件，BxSlider 。我想展示这部分，我的意思是图像，
<li id="miori"><img src="http://images.ciatr.jp/2015/12/09202601/05c36a2c5ba65065ac4f2a6f6c75b3e1_55.jpeg"></li>
当我点击以下部分时。
<dd id="miori"><a href="">miori</a></dd>
我应该如何为该 Action 编写 JavaScript 代码？ 您能给我一些建议吗？
<html>
<head>
<title>bxslider</title>
<link href="/jquery.bxslider/jquery.bxslider.css" rel="stylesheet" />
</head>
<body>
<dl class="sample">
<dt>menu</dt>
<dd id="tao"><a href="">tao</a></dd>
<dd id="miori"><a href="">miori</a></dd>
</dl> <!-- sample -->
<ul class="bxslider">
<li id="tao"><img src="http://koi-navi.net/wp-content/uploads/2015/10/5e9dd24e-e1444440113499.jpg"> </li>
<li id="miori"><img src="http://images.ciatr.jp/2015/12/09202601/05c36a2c5ba65065ac4f2a6f6c75b3e1_55.jpeg"></li>
</ul> <!-- bxslider -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/jquery.bxslider/jquery.bxslider.min.js" type="text/javascript" ></script>}
<script type="text/javascript">
$(document).ready(function(){
$('.bxslider').bxSlider();
$('dd#miori').on('click', function(){
alert("hello"); // what should I write here?
});
});
</script>
</body>
</html>
最佳答案
引用此:http://bxslider.com/examples/thumbnail-pager-1
试试这个:
<html>
<head>
<title>bxslider</title>
<link href="/jquery.bxslider/jquery.bxslider.css" rel="stylesheet" />
</head>
<body>
<!-- <dl class="sample">
<dt>menu</dt>
<dd id="tao"><a href="">tao</a></dd>
<dd id="miori"><a href="">miori</a></dd>
</dl> <!-- sample -->
<div id="bx-pager">
<a data-slide-index="0" href="">tao</a>
<a data-slide-index="1" href="">miori</a>
</div>
<ul class="bxslider">
<li id="tao"><img src="http://koi-navi.net/wp-content/uploads/2015/10/5e9dd24e-e1444440113499.jpg"> </li>
<li id="miori"><img src="http://images.ciatr.jp/2015/12/09202601/05c36a2c5ba65065ac4f2a6f6c75b3e1_55.jpeg"></li>
</ul> <!-- bxslider -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/jquery.bxslider/jquery.bxslider.min.js" type="text/javascript" ></script>}
<script type="text/javascript">
$(document).ready(function () {
$('.bxslider').bxSlider({pagerCustom: '#bx-pager'});
/*$('dd#miori').on('click', function () {
alert("hello"); // what should I write here?
});*/
});
</script>
</body>
</html>
关于javascript - 当我点击 BxSlider 的链接时，如何更改图像？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39303520/