-3

我是 javascript 新手，需要帮助来解决这个问题。

我有三个菜单可供您选择和选项，并且对于您选择的每个菜单，它都会显示一行数据。在每一行（即 3 行 3 个选项）中，您可以使用另一个选择菜单来选择该产品的供应商。我创建了另一个选择，您选择默认提供程序并 onchange 行中的其他菜单更改。我遇到的问题是它们都具有相同的 id，因为当您选择一个选项时，会调用一个函数。我尝试遍历所有选择，并从那些选择中使用 id=x 更改选定选项，但仅适用于使用该 id 找到的第一个选择

echo" function pickprovider($name, $idname){ \n";

echo" <select name='$name' id='idname'> \n";
echo" <option>1stprovider </option> \n";
echo"  <option>2ndprovider </option>\n";
echo " </select>\n";
echo" }\n";

echo" function defaultprovider($name, $idname) {\n";
echo" <select name='$name' id='idname' onchange='changeDflt(this);'> \n";
echo " <option>1stprovider </option> \n";
echo " <option>2ndprovider </option> \n";
echo "</select>\n";
echo" }\n";

 echo "<script type='text/javascript'>\n";
 echo "function ChangeDflt(list) { \n";
 echo "var x = list.options[list.selectedIndex].text;\n";
 echo "var allSelects = document.getElementsByTagName('select');\n";
 echo "for (var i = 0; i < allSelects.length; i++) { \n";
 ....
 change selected options for selects 
 echo "}\n";
 echo "}\n";
 echo "</script<\n";

我不知道每次调用函数时如何更改函数以生成唯一的 id。....当我获得页面中的所有选择元素时，我可以使用“div”标签吗？

4

1 回答 1

0

我不太确定你想用这些select元素来完成什么，但如果你构造你的 PHP 以不同的方式发出 HTML 和 JavaScript，它会变得更容易阅读和更容易编写你的 HTML 和 JavaScript。

<?php
    $base_id = "mySelect";      // set the string used as the basis for ids
    $base_name = $base_id;      // set the string used as the basis for names. There's no reason it cannot be the same as the id.

    $select_id = $base_id;      // set a variable to use for the id of the select
    $select_name = $base_name;  // set a variable to use for the name of the select

    // start a loop to emit the select elements
    for ($i = 0; $i < 3; $i++) {
        $select_id = $base_id.$i;       // set the id of the select to the base concatentated with the incrementer variable
        $select_name = $base_name.$i;   // same for the name. Variable value will be substituted on emission.
        echo "
<select name=\"$select_name\" id=\"$select_id\" onchange=\"changeDefault(this);\">
    <option value=\"0\">1st provider</option>
    <option value=\"1\">2nd provider</option>
</select>
";
    }
    // emit the JavaScript
    echo "
<script type='text/javascript'>
var changeDefault = function changeDefault(list) {
    var val = list.options[list.selectedIndex].value,           // get the value of the selected option
        allSelects = document.getElementsByTagName('select'),   // get the rest of the selects
        options = null,                                         // placeholder for option elements
        i = 0,                                                  // incrementer 1
        j = 0;                                                  // incrementer 2
    // change selected options for selects
    for (i = 0; i < allSelects.length; i += 1) {
        // get all option elements that are children of the select element
        options = allSelects[i].getElementsByTagName('option');
        // loop through the option elements
        for (j = 0; j < options.length; j += 1) {
            // set selected to true if the values match and false if they do not
            options[j].selected = options[j].value === val;
        }
    }
};
</script>
    ";
?>

也就是说，语法结构如下：

function defaultprovider($name, $idname) {
<select name='$name' id='idname' onchange='changeDflt(this);'>
 <option>1stprovider </option>
 <option>2ndprovider </option>
</select>
}

是完全无效的 JavaScript 代码，不会运行。您可能想查看有关 JavaScript 的教程。我推荐这个：http ://www.hunlock.com/blogs/Essential_Javascript_--_A_Javascript_Tutorial 。它从基础开始，比我能更好地解释 JavaScript。

于 2013-02-02T04:21:38.307 回答