如何在Javascript中将选定选项设置为默认选择

Posted 2023-05-09

【中文标题】如何在Javascript中将选定选项设置为默认选择

【英文标题】：How to set selected option to default selected in Javascript

【发布时间】：2016-10-01 15:09:47

【问题描述】：

我有选择具有具体化风格的选项，在选择选项中我想检查选项的值是否存在于数据库中。

HTML 代码：

<div class="row margin">
   <div id="input-select" class="section">
       <label>Supir</label>
          <select name="id_personalia" id="id_personalia" onchange="cek_supir()">
              <option id="default_supir" value="default_supir" disabled selected>pilih supir</option>
               <?php
                 foreach ($supir as $s) 
                ?>
                 <option value="<?= $s->id_personalia; ?>"> <?= $s->nama_ktp . " " . $s->id_personalia; ?> </option>
                <?php
                
                ?>
          </select>
     </div>
</div>

JavaScript 代码：

<script>
function cek_supir() 
    var supir = document.getElementById("id_personalia").value;
    var data = <?php echo json_encode($stat_supir) ?>;

    for (var i = 0; i < data.length; i++) 
        if (supir == data[i]) 
            $("#id_personalia").val('default_supir');
            Materialize.toast('Supir sedang bertugas', 3500);
            //document.getElementById("default_supir").selected = true;
            //document.getElementById("id_personalia").selected = false;
        
    

问题是选择选项不能设置选择的选项。

【问题讨论】：

jquery 代码在哪里？

document.getElementById("id_personalia").value=data

@guradio 代码就这样，不多了

@Rayon var 数据的内容是 json broo。不过感谢关注呵呵

【参考方案1】：

materialize 选择会覆盖浏览器默认值，因此当您更改select 元素中的值时，您需要更新组件，使用.material_select()：

function cek_supir() 
    var supir = document.getElementById("id_personalia").value;
    var data = <?php echo json_encode($stat_supir) ?>;

    for (var i = 0; i < data.length; i++) 
        if (supir == data[i]) 
            $("#id_personalia").val('default_supir');
            $("#id_personalia").material_select();
            Materialize.toast('Supir sedang bertugas', 3500);
        
    

请参阅docs 了解更多信息。

【讨论】：

还是不行，我试试$("#id_personalia").material_select();

@AfganGanjar 几分钟前，你说那行得通。发生了什么？

我在另一种情况下尝试代码正常工作，但是当我在这种情况下尝试代码不工作。

@AfganGanjar 检查您的 JSON 数据和 html 标记。选择码正确。