Javascript - 如果选择下拉菜单,则更改容器中的图像

发布于 2024-09-13 01:46:10 字数 704 浏览 2 评论 0原文

嘿伙计们。我试图用我认为简单的 JavaScript 来更改容器中的图像,但似乎无法弄清楚。 “cover-image”是图像所在的容器,“txtMontage”是下拉列表的ID。如果我按原样运行它,无论我选择什么,图像都是由第一个 if 语句设置的,然后下拉菜单会卡在上面,所以我无法选择其他任何内容。

关于如何解决这个问题有什么想法吗?谢谢。

<script type="text/javascript">
    function showPreview() {

        var image = document.getElementById("cover-image");
        var dropd = document.getElementById("txtMontage");

        if (dropd.value = "abrasives") {
            var container= "img/abrasives.jpg";
            image.src = container;
        }
        else if (dropd.value = "industrial") {
            var container= "img/gen-industrial.jpg";
            image.src = container;
        }

    }
</script>

Hey guys. I'm trying to change the image in a container with what I thought was simple javascript, but can't seem to figure it out. "cover-image" is the container where the image is, and "txtMontage" is the ID of the drop down list. If I run this as is, no mater what I select the image is set by the first if statement, and then the drop down gets stuck on it so I can't select anything else.

Any ideas on how to fix this? Thanks.

<script type="text/javascript">
    function showPreview() {

        var image = document.getElementById("cover-image");
        var dropd = document.getElementById("txtMontage");

        if (dropd.value = "abrasives") {
            var container= "img/abrasives.jpg";
            image.src = container;
        }
        else if (dropd.value = "industrial") {
            var container= "img/gen-industrial.jpg";
            image.src = container;
        }

    }
</script>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

不离久伴 2024-09-20 01:46:10

您在条件中指定 = 而不是 ==

使用:

if (dropd.value == "abrasives") {

而不是:

if (dropd.value = "abrasives") {

You are specifying = instead of == in your conditions:

Use:

if (dropd.value == "abrasives") {

Instead of:

if (dropd.value = "abrasives") {
你是年少的欢喜 2024-09-20 01:46:10

您需要将 if 更改为

 if (dropd.value == "abrasives")

In javascript = 设置对象的值,并使用 == 进行比较

You need to change your if to say

 if (dropd.value == "abrasives")

In javascript = sets the value of an object and == is used for comparison

夜无邪 2024-09-20 01:46:10
<script language="javascript">
function jsDropDown(imgid,folder,newimg){
document.getElementById(imgid).src = "http://mcxbazaar.com/Abazar_new/Abazar_html_them2/" + folder + "/" + newimg + ".jpg"; 

}


</script>

<div style="width:600px; height:300px;">
<div style="float:left; width:280px;"> <select class="input_select" name="products"   onchange="jsDropDown('rahul','images',this.value)">

                             <option value="PALLET-RACKING">Pallet Racking</option>
                          <option value="SLOTTED-ANGLE-RACKING">Slotted Angel</option>
                          <option value="BOLT-FREE">Bolts Free</option>
                          <option value="Pallet-Rack">Rack Supported Plateform</option>
                          <option value="PLASTIC-BINS">Plastic Bins</option>
                            </select></div>
        <div style="float:left; width:280px; height:300px">
        <img src="http://mcxbazaar.com/Abazar_new/Abazar_html_them2/images/PALLET-RACKING.jpg" width="300" height="300" id="rahul" ></div>
</div>
<script language="javascript">
function jsDropDown(imgid,folder,newimg){
document.getElementById(imgid).src = "http://mcxbazaar.com/Abazar_new/Abazar_html_them2/" + folder + "/" + newimg + ".jpg"; 

}


</script>

<div style="width:600px; height:300px;">
<div style="float:left; width:280px;"> <select class="input_select" name="products"   onchange="jsDropDown('rahul','images',this.value)">

                             <option value="PALLET-RACKING">Pallet Racking</option>
                          <option value="SLOTTED-ANGLE-RACKING">Slotted Angel</option>
                          <option value="BOLT-FREE">Bolts Free</option>
                          <option value="Pallet-Rack">Rack Supported Plateform</option>
                          <option value="PLASTIC-BINS">Plastic Bins</option>
                            </select></div>
        <div style="float:left; width:280px; height:300px">
        <img src="http://mcxbazaar.com/Abazar_new/Abazar_html_them2/images/PALLET-RACKING.jpg" width="300" height="300" id="rahul" ></div>
</div>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文