如何使用If语句在Javascript中对不同的If使用相同的函数

Question

我必须使用相同的函数根据IDs上的onClick事件打开不同的模态。我使用If条件进行检查，但它总是将第一个条件设为true。请帮帮忙。

//html
<div id="Remote-Parking" class="element parking" onclick="modalFunction()">Remote-Parking</div>
<div id="Emergency-Braking" class="element collision-detection" onclick="modalFunction()">Emergency-Braking</div>


//javascript
function modalFunction() {
    if (document.getElementById('Emergency-Braking').onclick) {
        document.getElementById('Popup-Emergency-Braking').style.display="block";
    }
    if (document.getElementById('Remote-Parking').onclick) {
        document.getElementById('Popup-Remote-Parking').style.display="block";
    }
}

Answer 1

按照你问问题的方式，我的答案如下。希望能对你有所帮助

​

<div id="Remote-Parking" class="element parking" onclick="modalFunction( this.id )">Remote-Parking</div>
<div id="Emergency-Braking" class="element collision-detection" onclick="modalFunction( this.id )">Emergency-Braking</div>

<script>
function modalFunction( id ) {
   
    if ( id == 'Remote-Parking') {
        //document.getElementById('Popup-Emergency-Braking').style.display="block";
        console.log('IF');
    } else if ( id == 'Emergency-Braking' ){
        //document.getElementById('Popup-Remote-Parking').style.display="block";
        console.log('ELSE');
    } else {
        // in case id didn't find
        // do something;
    }
}
</script>

​

Answer 2

您可以在函数调用中使用this关键字作为参数，并在函数中对其进行操作

​

function modalFunction(e) {
if(e.getAttribute("id")=="Emergency-Braking")
console.log("Emergency-Braking");
if(e.getAttribute("id")=="Remote-Parking")
console.log("Remote-Parking");

}

<div id="Remote-Parking" class="element parking"
onclick="modalFunction(this)">Remote-Parking</div>

<div id="Emergency-Braking" class="element collision-detection" onclick="modalFunction(this)">Emergency-Braking</div>

​

Answer 3

您可以执行类似的操作：

​

function modalFunction(val) {
	if(val == "park") {
		console.log("park");
	} else if(val == "brake") {
		console.log("brake");
	}
}

<div id="Remote-Parking" class="element parking" onclick="modalFunction('park')">park</div>

<div id="Emergency-Braking" class="element collision-detection" onclick="modalFunction('brake')">brake</div>

​