jQuery：eq（）选择器不适用于多个页面

Question

我正在使用laravel，并且在我的模式视图（弹出窗口）中有以下代码：

<ul class="slick3-dots" style="" role="tablist">
<li class="" role="presentation">
<img src="http://localhost:8000/image.jpg">
<div class="slick3-dot-overlay"></div>
</li>
<li role="presentation" class="">
<img src="http://localhost:8000/image2.jpg">
<div class="slick3-dot-overlay"></div>
</li>
<li role="presentation" class="slick-active">
<img src="http://localhost:8000/image3.jpg">
<div class="slick3-dot-overlay"></div>
</li>
</ul>

在我的脚本中，我编写了此代码以选择li中的3张图像，以便在弹出窗口处于活动状态时更改其来源：

$('.js-show-modal1').on('click',function(e){
e.preventDefault();
var main1, main2, main3;
 main1 = $('ul.slick3-dots li:eq(0) img');
 main2 = $('ul.slick3-dots li:eq(1) img');
 main3 = $('ul.slick3-dots li:eq(2) img');
$('.js-modal1').addClass('show-modal1');
 main1.attr('src', '{{ Config::get('app.url') }}/' + image);
 main2.attr('src', '{{ Config::get('app.url') }}/storage/' + images[0]);
 main3.attr('src', '{{ Config::get('app.url') }}/storage/' + images[1]);
});

我现在的问题是，当我将我的模态视图包含在索引中时，一切都可以正常运行；存储中的图像已加载，但包含在另一个视图中时不会加载。