Jquery 链接一次单击将链接id添加到选择器
我正在尝试将我的链接id添加到函数中的选择器,以便根据单击的链接显示或隐藏.xxxxxx 1,2或3。以下是迄今为止我整理的代码: 我试过做Jquery 链接一次单击将链接id添加到选择器,jquery,hide,selector,this,show,Jquery,Hide,Selector,This,Show,我正在尝试将我的链接id添加到函数中的选择器,以便根据单击的链接显示或隐藏.xxxxxx 1,2或3。以下是迄今为止我整理的代码: 我试过做$('.video'+videoplay),这是我想要做的事情,但这不起作用 Jquery: $(document).ready(function() { $('.videoPlay').click(function(){ var videoplay = $(this.id); $('.videoSubT
$('.video'+videoplay)
,这是我想要做的事情,但这不起作用
Jquery:
$(document).ready(function() {
$('.videoPlay').click(function(){
var videoplay = $(this.id);
$('.videoSubTitle').hide();
$('#video' + videoplay).show();
$('#videoPlay' ).hide();
$('#videoPlay' + videoplay).show();
});
});
HTML:
最新视频
选择下面的视频
视频1
视频2
视频3
视频1
这是一个很好的例子,它是一个很好的例子
长度:59秒
视频2
这是一个很好的例子,它是一个很好的例子
长度:59秒
视频3
这是一个很好的例子,它是一个很好的例子
长度:59秒
var videoplay=$(this.id)
错误,不应将其包装在$()
中
演示:
<h2>Latest videos</h2>
<h3 class="videoSubTitle">Choose a video below</h3>
<h3 class="videoSubTitle" id="video1" style="display:none;">Video 1</h3>
<h3 class="videoSubTitle" id="video2" style="display:none;">Video 2</h3>
<h3 class="videoSubTitle" id="video3" style="display:none;">Video 3</h3>
<div id="listContainer">
<div id="videoPlay1">
<img src="" style="width:650px; height:360px;" />
</div>
<div id="videoPlay2" style="display:none;">
</div>
<div id="videoPlay3" style="display:none;">
</div>
<div id="videoContent 1">
<img src="" width="240" style="margin-right:20px;" height="150" alt="video 1" align="left" />
<h2>Video 1 <a class="videoPlay" id="1" href="#">WATCH NOW</a></h2>
<h4><span class="lblShortDesc">berhj brhej beghrjbg hrjebh grebeghr jbh rjbh jgrebhjg rbhj gbehrjbr ehjbgh rejbeghjr<br />
<br /><span style="font-size:12px;">Length: 59 secoonds</span>
</span>
</h4>
</div>
<div id="videoContent 2">
<img src="" width="240" style="margin-right:20px;" height="150" alt="video 2" align="left" />
<h2>Video 2 <a class="videoPlay" id="2" href="#">WATCH NOW</a></h2>
<h4><span class="lblShortDesc">berhj brhej beghrjbg hrjebh grebeghr jbh rjbh jgrebhjg rbhj gbehrjbr ehjbgh rejbeghjr<br />
<br /><span style="font-size:12px;">Length: 59 secoonds</span>
</span>
</h4>
</div>
<div id="videoContent 3">
<img src="" width="240" style="margin-right:20px;" height="150" alt="video 3" align="left" />
<h2>Video 3 <a class="videoPlay" id="3" href="#">WATCH NOW</a></h2>
<h4><span class="lblShortDesc">berhj brhej beghrjbg hrjebh grebeghr jbh rjbh jgrebhjg rbhj gbehrjbr ehjbgh rejbeghjr<br />
<br /><span style="font-size:12px;">Length: 59 secoonds</span>
</span>
</h4>
</div>
$(document).ready(function() {
$('.videoPlay').click(function(){
var videoplay = this.id;
$('.videoSubTitle').hide();
$('#video' + videoplay).show();
$('#videoPlay' ).hide();
$('#videoPlay' + videoplay).show();
});
});