Javascript 如何在php中获取下拉值

Javascript 如何在php中获取下拉值,javascript,php,html,Javascript,Php,Html,大家好,我正在开发PHP应用程序,我使用javascript根据另一个下拉框选择填充一个下拉框-一切正常,但第二个下拉框的值是数字,我的问题是如何将第二个下拉框的值设置为文本而不是我得到的数字 我有以下下拉框代码: <!-- Our food group drop down--> <select id="foodgroups" onchange="selectFoods(this.options[this.selectedIndex].id)">

大家好,我正在开发PHP应用程序,我使用javascript根据另一个下拉框选择填充一个下拉框-一切正常,但第二个下拉框的值是数字,我的问题是如何将第二个下拉框的值设置为文本而不是我得到的数字

我有以下下拉框代码:

    <!-- Our food group drop down-->
   <select id="foodgroups" onchange="selectFoods(this.options[this.selectedIndex].id)">
        <option id="1" value="">Select a Food Group</option>
        <option id="2"value="Fruit">Fruit</option>
        <option id="3" value="Vegetables">Vegetables</option>
        <option id="4" value="Meat">Meat</option>
        <option id="5" value="Dairy">Dairy</option>
        <option id="6" value="Grains">Grains</option>
    </select>

    <!-- Our foods for a group selection (empty on default) -->


 <select id="foods" name="selectedFoodItem"></select>

选择一个食物组
果
蔬菜
肉
乳品的
谷物
下面是填充第二个下拉列表的函数

 function selectFoods(foodGroup) {
        // Get a reference to the foods select.
        var foodsSelect = document.getElementById("foods");

        // Create a two dimension array containing foods for each group.
        var foods = [["Banana","Grapes","Oranges","Watermelon"],
                    ["Brocolli", "Califlower","Spinach","Tomatoes"],
                    ["Beef", "Chicken", "Turkey", "Tuna"],
                    ["Cheese", "Ice Cream", "Milk", "Yogurt"],
                    ["Bread", "Pasta", "Rice", "Quinoa"]];

        if ((foodGroup >= 0) && (foodGroup <= foods.length)) {
            foodsSelect.options.length = 0;

            // Index was in range, so access our array and create options.
            for (var i = 0; i < foods[foodGroup - 1].length; i++) {
               foodsSelect.options[foodsSelect.options.length] = new Option(foods[foodGroup - 1][i], i);
            }

        }
    }
function selectFoods(foodGroup){
//获取所选食物的参考。
var foodselect=document.getElementById(“食品”);
//创建包含每组食物的二维数组。
var食品=[“香蕉”、“葡萄”、“橙子”、“西瓜”],
[“花椰菜”、“加州花”、“菠菜”、“西红柿”],
[“牛肉”、“鸡肉”、“火鸡”、“金枪鱼”],
[“奶酪”、“冰淇淋”、“牛奶”、“酸奶”],
[“面包”、“意大利面”、“大米”、“藜麦”];
如果((foodGroup>=0)和(&(foodGroup)因为ID从2开始(有效的ID)并且您的食物选择索引从2开始,那么只需在函数运行后获取ID,然后
-2
,然后将其用作数组选择中的索引,并在其中循环所有这些值以创建标记:

function selectFoods(foodGroup) {
    // Get a reference to the foods select.
    var foodsSelect = document.getElementById("foods");

    // Create a two dimension array containing foods for each group.
    var foods = [["Banana","Grapes","Oranges","Watermelon"],
                ["Brocolli", "Califlower","Spinach","Tomatoes"],
                ["Beef", "Chicken", "Turkey", "Tuna"],
                ["Cheese", "Ice Cream", "Milk", "Yogurt"],
                ["Bread", "Pasta", "Rice", "Quinoa"]];

    var options = '';
    var selected = foodGroup.id - 2; // get the ID minus 2
    var l = foods[selected].length;
    for(var i = 0; i < l; i++) { // loop foods and get the selected thru the index selected
        options += '<option value="' + foods[selected][i] + '">' + foods[selected][i] + '</option>';
    }

    foodsSelect.innerHTML = options;
}
function selectFoods(foodGroup){
//获取所选食物的参考。
var foodselect=document.getElementById(“食品”);
//创建包含每组食物的二维数组。
var食品=[“香蕉”、“葡萄”、“橙子”、“西瓜”],
[“花椰菜”、“加州花”、“菠菜”、“西红柿”],
[“牛肉”、“鸡肉”、“火鸡”、“金枪鱼”],
[“奶酪”、“冰淇淋”、“牛奶”、“酸奶”],
[“面包”、“意大利面”、“大米”、“藜麦”];
var选项=“”;
var selected=foodGroup.id-2;//获取id减去2
var l=食物[选定]。长度;
对于(var i=0;i

由于这行代码,您的PHP代码获得的是索引,而不是预期的字符串值:

new Option(foods[foodGroup - 1][i], i);
第一个参数是您在select中看到的值,而第二个参数是提交到服务器端的值。在您的示例中,其中一个选项的呈现方式如下:

<option value="0">Brocolli</option>
new Option(foods[foodGroup - 1][i], foods[foodGroup - 1][i]);
其结果是:

<option value="Brocolli">Brocolli</option>
Brocolli

示例更改此脚本代码

function selectFoods(foodGroup) {
        // Get a reference to the foods select.
        var foodsSelect = document.getElementById("foods");

        // Create a two dimension array containing foods for each group.
        var foods = [["Banana","Grapes","Oranges","Watermelon"],
                    ["Brocolli", "Califlower","Spinach","Tomatoes"],
                    ["Beef", "Chicken", "Turkey", "Tuna"],
                    ["Cheese", "Ice Cream", "Milk", "Yogurt"],
                    ["Bread", "Pasta", "Rice", "Quinoa"]];

        if ((foodGroup > 1) && ((foodGroup-1) <= foods.length)) {
            foodsSelect.options.length = 0;

            // Index was in range, so access our array and create options.
            for (var i = 0; i < foods[foodGroup - 2].length; i++) {

               foodsSelect.options[foodsSelect.options.length] = new Option(foods[foodGroup - 2][i], foods[foodGroup - 2][i]);
            }

        }
}
function selectFoods(foodGroup){
//获取所选食物的参考。
var foodselect=document.getElementById(“食品”);
//创建包含每组食物的二维数组。
var食品=[“香蕉”、“葡萄”、“橙子”、“西瓜”],
[“花椰菜”、“加州花”、“菠菜”、“西红柿”],
[“牛肉”、“鸡肉”、“火鸡”、“金枪鱼”],
[“奶酪”、“冰淇淋”、“牛奶”、“酸奶”],
[“面包”、“意大利面”、“大米”、“藜麦”];

如果((foodGroup>1)和((foodGroup-1)尝试
onchange=“selectFoods(this.options[this.selectedIndex].value)”
?这是“西兰花”,顺便说一句。谢谢Danilo:)您最好,我建议您做一个更改。不要在for循环中重新计算长度。将值存储在for循环之前的变量中,然后使用它。@RST在那里,更好谢谢您的解决方案对我真的有效#KeepKooKeeng@Terabyte当然,很高兴这有帮助