选择默认的图像加载页面加载

我有一个下拉，其中更改定义的DIV内的图像。加载页面时，默认情况下不会选择任何图像，只有当您选择显示下拉选项时才会显示。我希望它在页面加载时从列表中选择第一个选项。选择默认的图像加载页面加载

<div id="eyelash_style_img"></div> 

<select id="eyelash_style_select" name="os0"> 
    <option value="select">-Choose a Style-</option> 
    <option value="L004">L004 </option> 
    <option value="L005">L005 </option> 
    <option value="L010">L010 </option> 
    <option value="L021">L021 </option> 
    <option value="L024">L024 </option> 
    <option value="L038">L038 </option> 
</select> 

<script type="text/javascript"> 

$("#eyelash_style_select").change(function() { 
$("#eyelash_style_img").html($("<img />", { src: "<?=HTTP_HOST;?>Shopping/Images/" + $(this).val() + ".jpg" })); }); 

</script>

来源

2014-01-10 JordanC26

使用selected属性

<select id="eyelash_style_select" name="os0"> 
     <option value="select">-Choose a Style-</option> 

    <option value="L004" selected>L004 </option> 
     <option value="L005">L005 </option> 
     <option value="L010">L010 </option> 
     <option value="L021">L021 </option> 
     <option value="L024">L024 </option> 
     <option value="L038">L038 </option> 
    </select>

的Javascript：

$(document).ready(function() { 
(
$("#eyelash_style_img").html($("<img />", { src: "<?=HTTP_HOST;?>Shopping/Images/" + $(this).val() + ".jpg" })); }); 
});

这个脚本加载页面加载后的图像，只是加入document.ready的change函数加载默认的图像是选择，您需要both

$("#eyelash_style_select").change(function() { 
$("#eyelash_style_img").html($("<img />", { src: "<?=HTTP_HOST;?>Shopping/Images/" + $(this).val() + ".jpg" })); });

来源

2014-01-10 12:45:01

选择下拉列表中的选项，但不会自动加载图像。 – JordanC26

然后在document.ready中写脚本 –

我编辑了我的代码 –

只需设置选定的属性如下。

<option value="1" selected="selected">1</option> 
<option value="2">2</option> 
<option value="3">3</option>

来源

2014-01-10 12:47:27

创建页面onload事件并在页面加载后选择列表中的第一个选项。

$(document).ready(function() { 
(
    $("#eyelash_style_select").prop('selectedIndex', 0); 
});

来源

2014-01-10 12:47:35

选择默认的图像加载页面加载

回答

相关问题