#javascript #shopify #liquid
#javascript #Shopify #жидкость
Вопрос:
Ниже у меня есть код, который показывает один из предустановленных баннеров случайным образом.
Однако я хочу иметь отдельную ссылку для каждого баннера.
Как вы можете видеть в коде, в настоящее время он имеет только одну одинаковую ссылку для каждого баннера. Может кто-нибудь посоветовать?
<script type="text/javascript">
var imageCount = 4;
$(function(){
var whichImage=get_random();
var image=new Array(imageCount)
image[0] = "<img src="{{ 'HADER-AO-UNTUK-DI-BI-5.jpg' | asset_url }}" />";
image[1] = "<img src="{{ 'HADER-AO-UNTUK-DI-BI-6.jpg' | asset_url }}" />";
image[2] = "<img src="{{ 'HADER-AO-UNTUK-DI-BI-7.jpg' | asset_url }}" />";
image[3] = "<img src="{{ 'HADER-AO-UNTUK-DI-BI-8.jpg' | asset_url }}" />";
function get_random() {
var ranNum= Math.floor(Math.random()* imageCount );
return ranNum;
}
$('#randimage p a').prepend(image[whichImage]);
});
</script>
<div id="randimage" align="center"><p><a href="https://alatolahraga.id"></a></p></div>
Ответ №1:
Есть несколько способов, это не самый лучший, но он подходит для вашего кода.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
const image= [
"<a href="https://alatolahraga.id"><img src="{{ 'HADER-AO-UNTUK-DI-BI-5.jpg' | asset_url }}" /></a>",
"<a href="https://alatolahraga.id"><img src="{{ 'HADER-AO-UNTUK-DI-BI-6.jpg' | asset_url }}" /></a>",
"<a href="https://alatolahraga.id"><img src="{{ 'HADER-AO-UNTUK-DI-BI-7.jpg' | asset_url }}" /></a>",
"<a href="https://alatolahraga.id"><img src="{{ 'HADER-AO-UNTUK-DI-BI-8.jpg' | asset_url }}" /></a>"
];
const whichImage=get_random();
function get_random() {
return Math.floor(Math.random() * image.length );
}
$('#randimage p').prepend(image[whichImage]);
});
</script>
<div id="randimage" align="center"><p></p></div>