将php值回显到javascript onchange()

时间:2018-04-06 19:16:31

标签: javascript php

我有这个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,并获得结果。

3 个答案:

答案 0 :(得分: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检查是否在页面源代码中形成了porper代码

或者如果报价是复杂的,则使用一些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)"

答案 1 :(得分:0)

<select id="mySelect" onchange="myFunction()">
<option value="Audi">Audi
<option value="BMW">BMW
<option value="Mercedes">Mercedes
<option value="Volvo">Volvo
</select>



<script>
function myFunction() {
    var x = document.getElementById("mySelect").value;
    alert(x);
}
</script>

答案 2 :(得分:0)

我猜你在LAG之后错过了分号。