IF ELSE语句总是在第一个IF上返回True

Question

我正在尝试编写一个IF ELSE语句，它有几个不同的ELSE IF语句，可以在单击按钮时更改图片的源图像。

一个人将点击汽车的车身类型按钮，当点击它时，它将在3个现有按钮内显示背景图像。单击其中一个按钮后，图像的来源应该会改变。

每次运行代码时，它都只显示我第一个IF语句的图片。任何帮助都将不胜感激。我为Javascript缺乏知识而道歉，因为我自己在教自己。

HTML

<div id="vehicleModelFrame">
        <button id="modelFrameButton1" type="button"></button>
        <button id="modelFrameButton2" type="button"></button>
        <button id="modelFrameButton3" type="button"></button>
    </div>
    <div id="selectTrimTitle">
        <h3>
            Vehicle Trim
        </h3>
    </div>
    <div id="vehicleTrimFrame">
        <div class="trimSelector">
            <ul class="nav nav-tabs">
                <li class="active"><a data-toggle="tab" href="#home">Trim 1</a></li>
                <li><a data-toggle="tab" href="#menu1">Trim 2</a></li>
                <li><a data-toggle="tab" href="#menu2">Trim 3</a></li>
                <li><a data-toggle="tab" href="#menu3">Trim 4</a></li>
            </ul>
            <div class="tab-content">
                <div id="home" class="tab-pane active">
                    <img id="carLogo1" src="" alt="carLogo">
                </div>
                <div id="menu1" class="tab-pane">
                    <img id="carLogo2" src="noimage.png" alt="carLogo">
                </div>
                <div id="menu2" class="tab-pane">
                    <img id="carLogo3" src="noimage.png" alt="carLogo">
                </div>
                <div id="menu3" class="tab-pane">
                    <img id="carLogo4" src="noimage.png" alt="carLogo">
                </div>
            </div>
        </div>
    </div>

JAVASCRIPT

document.getElementById("modelFrameButton1").addEventListener("click", function showTrim1(){
var carImg = document.getElementById("carLogo1");
var backImg = document.getElementById("modelFrameButton1");

if (document.getElementById("modelFrameButton1").style.backgroundImage = "JeepWrangler.png") {

    carImg.src = "Jeep_Wrangler.png";

}else if (document.getElementById("modelFrameButton1").style.backgroundImage = "BMW3.png") {

    carImg.src = "BMW3.png";

}

为了学习Javascript，我想在Javascript领域保留可能的解决方案。

Answer 1

您需要使用等于运算符#include "imagepickerandroid.h" imagePickerAndroid::imagePickerAndroid() { } void imagePickerAndroid::buscaImagem() { QAndroidJniObject ACTION_PICK = QAndroidJniObject::fromString("android.intent.action.GET_CONTENT"); QAndroidJniObject intent("android/content/Intent"); if (ACTION_PICK.isValid() && intent.isValid()) { intent.callObjectMethod("setAction", "(Ljava/lang/String;)Landroid/content/Intent;", ACTION_PICK.object<jstring>()); intent.callObjectMethod("setType", "(Ljava/lang/String;)Landroid/content/Intent;", QAndroidJniObject::fromString("image/*").object<jstring>()); QtAndroid::startActivity(intent.object<jobject>(), 101, this); qDebug() << "OK"; } else { qDebug() << "ERRO"; } } void imagePickerAndroid::handleActivityResult(int receiverRequestCode, int resultCode, const QAndroidJniObject &data) { qDebug() << "Trabalha com os dados"; jint RESULT_OK = QAndroidJniObject::getStaticField<jint>("android/app/Activity", "RESULT_OK"); if (receiverRequestCode == 101 && resultCode == RESULT_OK) { QString imagemCaminho = data.callObjectMethod("getData", "()Landroid/net/Uri;").callObjectMethod("getPath", "()Ljava/lang/String;").toString(); emit imagemCaminhoSignal(imagemCaminho); qDebug() << imagemCaminho; } else { qDebug() << "Caminho errado"; } } ，而不是assignmet运算符==。

分配返回已分配的值，在本例中为真值字符串。

Answer 2

您测试了if document.getElementById("modelFrameButton1").style.backgroundImage = "JeepWrangler.png"，但使用单个等号意味着您已分配，而不是进行比较。将=更改为===（非类型强制等式检查）。在其他情况下，您可以使用==（类型强制相等），但===通常更正确（类型强制相等的行为很奇怪）。

Answer 3

这是因为您要分配值，而不是检查它：

backgroundImage = "JeepWrangler.png"

应该是：

backgroundImage === "JeepWrangler.png"

您的else if声明也会失败：

else if (document.getElementById("modelFrameButton1").style.backgroundImage = "BMW3.png")

应该是：

else if (document.getElementById("modelFrameButton1").style.backgroundImage === "BMW3.png")