我试图通过点击改变某些 div 的可见性。
我在数组上使用 php foreach 循环添加“主”div 和“子”div。
之后，我使用 javascript 向具有特定类的元素添加事件。
问题是 javascript 函数获取的元素名称在开始和结束时都带有双引号。
我可以通过使用“子字符串”来解决，但我是网络编程的新手，我需要了解为什么会发生这种情况，否则我永远无法提高自己的技能。
下面是我所有的代码。
<!DOCTYPE html>
<html>
<head>
<style>
.Class1 {
position:relative;
display: inline-block;
width: 48%;
margin: 3px;
border: 3px solid #CCC;
}
.Class2 {
position:absolute;
bottom:0;
right:0;
border: 1px solid #CCC;
margin:1px;
background: #FFC;
}
.H_p {
border: 1px solid #CCC;
display: inline-block;
}
.Opt {
border: 1px solid #CCC;
display: none;
}
</style>
</head>
<body>
<?php
$Divs = array('Div1'=>'Class1',
'Div2'=>'Class1',
'Div3'=>'Class1',
'Div4'=>'Class1',
'Div5'=>'Class1');
$AskToShow=array("Field1"=>"1.1.1", "Field2"=>"1.2.1", "Field3"=>"1.3.1");
foreach ($Divs as $Name=>$Class){
echo '
<div class="'.$Class.'">';
echo $Name.'<br/>';
echo '
<p id=”Btn_Opt'.$Name.'” class="Class2" >Show optionals</p>';
echo '
<div id=Opt'.$Name.' name="Opt'.$Name.'" class="Opt" >';
foreach ($AskToShow as $H_Name=>$Id){
echo'
<p id="H_'.$Id.'" class="H_p">'.$H_Name.'</p>';
}
echo '
</div>';
echo '
</div>';
}
?>
<script>
var MyClass = document.getElementsByClassName("Class2");
var myFunction = function() {
var SenderId = this.id;
alert (SenderId);
var SubId = SenderId.substring(SenderId.indexOf('_')+1)
alert (SubId);
var SubSH = document.getElementById(SubId);
if (!SubSH){
alert("Empty"); //This is the alert shown!!
}else{
alert(SubSH.name);
}
if (SubSH.style.display == 'none'){
document.getElementById(SubId).style.display = 'block';
}else{
document.getElementById(SubId).style.display = 'none';
}
};
for (var i = 0; i < MyClass.length; i++) {
MyClass[i].addEventListener('click', myFunction, false);
}
</script>
</body>
</html>
最佳答案
<p id=”Btn_Opt'.$Name.'” class="Class2" >Show optionals</p>';
您正在使用 ”(右双引号)来分隔您的属性值。仅允许使用 "(引号)和 '(撇号)。
因此，右双引号被视为数据，而不是定界符。
此代码示例以较大的字体显示了这三个字符，因此您可以清楚地看到它们之间的区别。
body { font-size: 50px; }”<br>"<br>'这通常是由于使用文字处理器而不是文本编辑器编写 HTML 造成的。
关于javascript - 在 Html 元素名称中获取双引号，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47325796/