用于显示修改为使用多个唯一div的div的javascript代码

我有一个表单字段，一旦更改它就会运行一个javascript函数。如果函数与特定的内容匹配，它将显示位于

我有一个独特的情况，我需要在多个选择框中使用相同的代码；但是，每一个都有一个特定的名称。他们不尽相同，需要独立工作。每个都有一个唯一的ID

如果在第一个字段中选择了ship with，我只希望显示第二个select字段

首先，这里是select字段的代码

<select name="first_select_option" onchange="ShowDiv(this);">
<option value="">Select Option</option>
<option value="SHIP WITH" id="SHIPWITH_<?php echo $data_order_id; ?>_Show">SHIP WITH</option>';
</select>

我试图修改它，并通过使用.split''来分解变量使其工作，但它不工作。我对JavaScript的掌握不如我希望的那么好。这是我的尝试

    <script type="text/javascript">
        function ShowDiv(nameSelect)
{
    console.log(nameSelect);
    if(nameSelect){

        var name = nameSelect;
        var splitName = name.split('_');

        alert(splitName[1]);

        OptionValue = document.getElementById(splitName[0] + splitName[1] + splitName[2]).value;
        if(OptionValue == nameSelect.value){
            document.getElementById(splitName[0] + splitName[1]).style.display = "block";
        }
        else{
            document.getElementById(splitName[0] + splitName[1]).style.display = "none";
        }
    }
    else{
        document.getElementById(splitName[0] + splitName[1]).style.display = "none";
    }
}
    </script>

装运 1. 2. 精选产品 1234 装运 1. 2. 精选产品 1234 装运 1. 2. 精选产品 1234

---

如注释中所述，看起来您想要获取的是所选选项的id，而不是select。实现这一点的一种方法是将select的属性与其集合结合使用，您还可以使用其他技术

我冒昧地修改了一些命名约定；通常，首字母大写表示对象的构造函数，而不是普通函数或变量。此外，根据变量赋值之前的需要，使用var、let或const可以防止它在默认情况下成为全局变量。还有其他一些小的修正，我将留给你们去发现

函数showDivnameSelect{ console.lognameSelect； 如果选择{ var selectedOption=namelect.options[namelect.selectedIndex]； var name=selectedOption.id； var splitName=name.split''； console.logsplitName[1]； var idOfSection=splitName[0]+'.'+splitName[1]； var optionValue=selectedOption.value； 如果optionValue==nameSelect.value{ document.getElementByIdidOfSection.style.display=block； }否则{ document.getElementByIdidOfSection.style.display=none； } }否则{ //对此进行注释，因为splitName将在此分支中未定义。。。 //document.getElementByIdsplitName[0]+splitName[1]。style.display=none； } } 装运 1. 2. 精选产品 1234 装运 1. 2. 精选产品 1234 装运 1. 2. 精选产品 1234

---

我建议使用CSS类，而不是像那样尝试组合ID。另外，+是JavaScript中的字符串连接操作符，而不是…我这样使用它们是因为我需要每个操作符独立工作。我不需要一个选择框就能显示所有隐藏字段。每个选择框都绑定到一个特定的隐藏字段，我编辑了代码，删除了我忘记删除的额外$并更改了代码。到+，它仍然不工作。它甚至没有提醒我这个名字。我不认为。拆分是有效的？很难分析这里发生了什么。你能不能拿一个呈现的HTML的例子，比如说，不是PHP代码，把它和你得到的代码结合起来，然后把它放在编辑器中的一个堆栈片段图标中，就像这样。这将使帮助变得更加容易。请修改您的问题，以清楚地包含使用单一选择的用例。现在，ShowDiv函数可能是单个select案例，它引用了一些NEWCC_Show元素，这在您的问题中完全不存在。

<script type="text/javascript">
        function ShowDiv(nameSelect)
{
    console.log(nameSelect);
    if(nameSelect){
        OptionValue = document.getElementById("NEWCC_Show").value;
        if(OptionValue == nameSelect.value){
            document.getElementById("NEWCC").style.display = "block";
        }
        else{
            document.getElementById("NEWCC").style.display = "none";
        }
    }
    else{
        document.getElementById("NEWCC").style.display = "none";
    }
}
    </script>

    <script type="text/javascript">
        function ShowDiv(nameSelect)
{
    console.log(nameSelect);
    if(nameSelect){

        var name = nameSelect;
        var splitName = name.split('_');

        alert(splitName[1]);

        OptionValue = document.getElementById(splitName[0] + splitName[1] + splitName[2]).value;
        if(OptionValue == nameSelect.value){
            document.getElementById(splitName[0] + splitName[1]).style.display = "block";
        }
        else{
            document.getElementById(splitName[0] + splitName[1]).style.display = "none";
        }
    }
    else{
        document.getElementById(splitName[0] + splitName[1]).style.display = "none";
    }
}
    </script>