我通过 PHP 在 SQL 中创建了一个包含 3 列的表。我试图以这种方式将值放入 SELECT 下拉列表中:
- 第一列将是 OPTION 的值(用于传递 POST)。
- 第二列将在 OPTION 的显示中。
- 第三列将被隐藏并固定在下拉列表中的每一行,因此当用户从下拉列表中选择一个选项时,隐藏的列将出现在其他 div 中。
例如,如果表是:
col1 col2 col3
-----------------
1 Joe Key st.
2 Matt Link st.
当用户选择 Joe 时,Key st.
将显示在一个单独的 div 中,当用户按下 enter 后,值 1
将通过 POST 发送。
这是我到目前为止得到的:
$('.foo3').on('change', function() {
var add = $(this).parent().find('.foo3').value();
$('.foo2').html(add);
});
<select class="foo3">
<?php while ($curRow=mysqli_fetch_array($TableOutput)) {
echo "<input class='foo' type='hidden' value='{$curRow['col3']}'><option value='{$curRow['col1']}'>{$curRow['col2']}</option>";
} ?>
</select>
<div class="foo2"></div>
谢谢!
最佳答案
您可以使用 data
属性将自己的元数据存储在元素中。然后,您可以在选择 option
时读回它。试试这个:
$('.foo3').change(function() {
$('.foo2').text($(this).find('option:selected').data('location'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="foo3">
<option>Please select...</option>
<option value="1" data-location="Key St.">Joe</option>
<option value="2" data-location="Link St.">Matt</option>
</select>
<div class="foo2"></div>
要创建该 HTML 输出,您的 PHP 应如下所示:
echo "<option value=\"{$curRow['col1']}\" data-location=\"{$curRow['col3']}\">{$curRow['col2']}</option>";
关于javascript - 如何将多个参数放入 OPTION for Javascript?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40718725/