javascript - 将 php 值回显到 javascript onchange()

Question

我有这个 html 选择表单，我正在使用 onchange 方法发送 xmlhttp 请求。

<select class="form-control form-control-sm" id="sizeselector<?php echo $row["id"]?>" name="sizes" onchange="showColors(<?php echo $row["id"];?>, item, size)">
<?php while($row1 = $result1->fetch_assoc()){?>
<option value="<?php echo $row1["size"]?>"><?php echo $row1["size"]?></option>
<?php}?></select>
<div id="colorselector<?php echo $row["id"]?>">
    <p>Text</p>
</div>

上面的代码有效，但是当我更改它以从行中获取实际值时...

onchange="showColors(<?php echo $row["id"];?>, <?php echo $row["name"]?>, this.value)"

根本不行，我能想到的都试过了。我没有收到任何错误。

function showColors(id, item, size) {
if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
} else {
    // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        document.getElementById("colorselector"+id).innerHTML = this.responseText;
    }
};
try{
    xmlhttp.open("GET","getColor.php?s=size&c=size",true);
    xmlhttp.send();
}catch(err){
    document.getElementById("colorselector").innerHTML = err.message;
}

}

更新:这是我从源代码中得到的输出。

<select class="form-control form-control-sm" id="sizeselector40" name="sizes"onchange='showColors(40,'Women's Unicorn', this.value)'>

使用...

onchange='showColors(<?php echo $row["id"];?>, <?php echo $row["name"]?>, this.value)'

更新2:即使我手动将值添加到 onchange 中，也没有任何反应..

onchange="showColors(27, t, a)"

function showColors(id, item, size) {
if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
} else {
    // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        document.getElementById("colorselector"+id).innerHTML = this.responseText;
    }
};
xmlhttp.open("GET","getColor.php?s="+item+"&c="+size,true);
xmlhttp.send();

}

我可以在另一个浏览器窗口中运行 getColor.php 并获取结果。

Answer 1

您应该对 javascript 代码和 php 索引使用不同的引号，否则使用相同的引号会形成错误的字符串

 onchange='showColors(<?php echo $row["id"];?> , <?php echo $row["name"]?>, this.value)'

或者尝试

 echo "onchange='showColors(".$row["id"] .",'". $row["name"] . "', this.value)'";

并用ctrl+U检查您的页面源代码中是否形成了不良代码

或者如果引号太复杂，请使用一些 var

    echo ' var my_id = ' . $row["id"] . ';';
    echo ' var my_name = "' . $row["name"] . '";';

    echo "onchange='showColors( my_id ,my_name, this.value)'";

并在名称中添加单引号，您可以尝试使用

onchange= "showColors(<?php echo $row['id'];?>, 
                    <?php echo '"'.  $row['name'] . '"' ?>, this.value)"