繁体   English   中英

根据选择选项更改表格单元格内容?

[英]Change table cell content based on select option?

这是选择块:

<form>
            <select id="select">
                <option disabled selected value="choose">
                    CHOOSE
                </option>
                <option value="i2g" id="i2g">
                    iPhone 2g
                </option>
                <option value="i3g" id="i3g">
                    iPhone 3g
                </option>
            </select>
            <button onclick="func1()" type="button">
                GO
            </button>
</form>

表格内容如下:

<table id="iphone1g" border="1">
            <tr>
                <td id="itable1">
                    1
                </td>
                <td id="itable2">
                    2
                </td>
            </tr>
        </table>

这是JavaScript:

<script>
            var x = document.getElementById("i2g")
            var y = document.getElementById("i3g")
            var m = document.getElementById("itable1")
            var n = document.getElementById("itable2")
            function func1(){
                if (x.selected = "true"){
                    m.innerHTML = "hello"
                } 
                if (y.selected = "true"){
                    m.innerHTML = "adele"
                }
            }
        </script>

没用 我只能选择整个选择中的一个,也只能是最后一个。

单一等于用于分配而不是比较,您应该使用==或===来检查是否选择了这些值。

您还尝试检查字符串值true,而不是布尔值true(.selected返回true或false而不是“ true”或“ false”)

有了这两个更改,它应该可以工作。

   var x = document.getElementById("i2g")
    var y = document.getElementById("i3g")
    var m = document.getElementById("itable1")
    var n = document.getElementById("itable2")
    function func1(){
        if (x.selected === true){
            m.innerHTML = "hello"
        } 
        if (y.selected === true){
            m.innerHTML = "adele"
        }
    }

首先,要比较Java脚本中的两个对象,应使用== not =

此外,您应该按照本ananser中的指示从SELECT中检索所选值。

好吧,让我们分解一下。 首先,您缺少许多分号; 其次,您需要使用==在if语句内部进行比较,而不仅仅是= 第三,通常通过检查所述选择的值而不是每个单独的选项来检查选择的值更容易。

这是一些工作代码和一个工作演示

var m = document.getElementById("itable1");
var n = document.getElementById("itable2");

var select = document.getElementById("select");

function func1() {
  if (select.value == "i2g"){
    m.innerHTML = "hello";
  } 
  if (select.value == "i3g"){
    m.innerHTML = "adele";
  }
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM