PHP foreach 循环，getElementById 的唯一 <select> id答案

【问题标题】：PHP foreach loop, unique <select> id for getElementByIdPHP foreach 循环，getElementById 的唯一 <select> id
【发布时间】：2012-10-09 04:23:17
【问题描述】：

我感兴趣的是下拉列表中的字符串中的 $option_value['price']，而不是 .使用 .value 返回后者。

我选择了在 foreach() 循环中创建的菜单。下拉菜单将保留价格选项。我正在尝试为每个产品提供它自己的 ID，以便我可以使用 javascript onChange() 函数来更新屏幕上的价格。

选择标签如下所示：

 <select name="option[<?php echo $option['product_option_id']; ?>]" class="select_options" id="select_<?php echo $product['product_id']; ?>" onchange="getIt(this);">

和javascript：

function getIt(el) {
var id = el.id;
a = document.getElementById(id).text;
alert(a);   
}

提醒 id 给我 select_some 号码。所以我可以看到它正在获取 id。但提醒我 [object HTMLSelectElement]。

所以我尝试了

alert(a.options.selectedIndex.value);

然后变得身份不明。

<?php if ($product['options']) { ?>
<div class="options" id="option_<?php echo $product['product_id']; ?>">
<?php foreach ($product['options'] as $option) { ?>
<?php if ($option['type'] == 'select') { ?>
<div id="option-<?php echo $option['product_option_id']; ?>" class="option select_option">    
  <select name="option[<?php echo $option['product_option_id']; ?>]" class="select_options" id="select_<?php echo $product['product_id']; ?>" onchange="getIt(this);">

    <option value=""><?php echo $text_select; ?></option>
    <?php foreach ($option['option_value'] as $option_value) { ?>

    <option value="<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?>

    <?php if ($option_value['price']) { ?>
    (<?php echo $option_value['price_prefix']; ?><span id="newPrice"><?php echo str_replace('.00','.',$option_value['price']); ?></span>)
    <?php } ?>
    </option>
    <?php } ?>
  </select>
</div>
<?php } ?>

【问题讨论】：

向我们展示生成的 HTML 代码
那么有没有办法让我获得下拉菜单中显示的文本 ($xx.xx)，而不是选项为 0,1,2,3,...

标签： php javascript drop-down-menu getelementbyid unique-id

【解决方案1】：

改变：

  a = document.getElementById(id).text;

收件人：

  a = document.getElementById(id).value;

这将提醒所选选项的值。

【讨论】：

表示选项的值... 0, 1, 2, 3 等等。我对价格感兴趣：$xx.xx。我认为 getElementById().text 给出了下拉列表中显示的内容...

【解决方案2】：

“有没有办法让我获得下拉菜单中显示的文本 ($xx.xx)，而不是值？”

我想这就是你要找的：

function getIt(el) {
   var a = el.options[el.selectedIndex].text;
   alert(a);
}

el.selectedIndex 显然会为您提供当前所选选项的索引，您可以将其用作选项集合el.options 的索引，然后获取该选项的text。 text 属性属于每个选项，而不是选择。

演示：http://jsfiddle.net/FCnUQ/

（请注意，如果未选择任何选项，selectedIndex 将是 -1。）

您根本不需要使用getElementById()，因为您已经拥有对元素el 的引用。

【讨论】：

这正是我所追求的......因为我在编码方面很糟糕，所以很难正确地提出这个问题。

【解决方案3】：

试试这个代码，用document.getElementById(id).value代替document.getElementById(id).text

function getIt(id) {
 a = document.getElementById(id).value;
 alert(a);   
}

【讨论】：

【解决方案4】：

当你像 getit(this) 这样传递时，你应该像这样编写代码

function getIt(el) {
var id = el.id;
a = document.getElementById(id).value;
alert(el.value);   //you can directly alert like this
}

【讨论】：