Question

我使用下拉菜单从我从 SQL 查询中获得的列表中选择选项：

<div id="container" action="import.php" method="post" enctype="multipart/form-data">
<span id="pickfiles">[Upload files]</span>
</div>

echo ' <form action="import.php" method="post" id="pickfiles" enctype="multipart/form-data">
       Adresslieferant:  <select name="taskOption">
           <option value="" disabled selected hidden>Adresslieferanten auswählen</option>';

foreach ($sql as $row) {
echo "<option value=' ".  $row['firma'] . " ' name='adresslieferung' id='adresslieferung' type='text'>".  $row['firma'] ."</option>";
}
echo '  </select>
    </form> ';
?>

这是我上传 csv 文件的表单的一部分，此代码段应选择下拉菜单的选项之一，该选项将在 javascript 代码段中提交：

FileUploaded: function(up, files, info) {
  window.open('import.php?file='+files.name+'&address_delivery='+(document.getElementById('adresslieferung') && document.getElementById('adresslieferung').value ? document.getElementById('adresslieferung').value : ''), '_blank')
    },

但是这样不管我在下拉菜单中选择哪个选项。它总是通过下拉菜单的第一选择。我想这是因为它只是用 id='adresslieferung' 选择了第一个，但我不知道我还能怎么做。

Answer 1

问题是您将 id 提供给 <options> 而不是 <select>，这就是为什么当您尝试使用此 id 获取数据时，它每次都会为您提供第一个值-时间。

从 id 中删除 <options> 并将其添加到 <select>

    <div id="container" action="import.php" method="post" enctype="multipart/form-data">
        <span id="pickfiles">[Upload files]</span>
    </div>

    echo '<form action="import.php" method="post" id="pickfiles" enctype="multipart/form-data">
        Adresslieferant:
        <select name="taskOption" id='adresslieferung'><!-- added id here-->
            <option value="" disabled selected hidden>Adresslieferanten auswählen</option>';
            foreach ($sql as $row) {
            //Remove id from options
            echo "<option value=' ".  $row['firma'] . " ' name='adresslieferung' type='text'>".  $row['firma'] ."</option>";
            }
        echo '</select>
    </form>';
?>

注意：jQuery/javascript 将 id 视为唯一属性，因此请确保 id 不会在 HTML 中使用两次。如果您想对一堆 html 元素应用一些事件处理，您可以使用 class 概念。（给它们相同的 class 并一次性应用事件处理）

下拉菜单总是选择第一个选项

1 个答案: