javascript - 在更改和加载时更新一些字段

Question

我们有以下脚本，该脚本在下拉列表更改时运行 - 根据所选货币代码更新价格。这基本上获取下拉列表的值并更新页面文本中的 priceamm 和 preicecurr 字段。

<script>
function run() {
    var f = document.getElementById("dropPrice");
    priceamm.innerHTML  = f.options[f.selectedIndex].value;
    var e = document.getElementById("dropPrice");
    pricecurr.innerHTML =  e.options[e.selectedIndex].text;
}

HTML

<select id="dropPrice" onchange="run()" class="fa-select">
  <option value = "a">aaa</option>
  <option value = "b">bbb</option>

问题现在，我们还想在加载页面(onload)时将下拉列表加载到选项之一(选定的)。我们可以填充文本中的变量，但不能填充下拉列表来显示选项bbb。在 php 中这很容易，但我们对 javascript 有点迷失。我们在这些线上尝试了一些 onload 但不起作用:

document.getElementById("dropPrice").value = "<?php echo $geo_price ;?>";

使用 jQuery 这可能会更容易，但再次不走运:

window.onload = function() {
    jQuery(document).ready(function($){
      document.getElementById('dropPrice').find('option[value=<?php echo $geo_price ;?>]').attr('selected','selected');
    });
    }

感谢任何帮助。谢谢

Answer 1

jQuery 选择器部分不正确。您将纯 JS 与 jQuery 混合在一起。当您调用 document.getElementById('dropPrice') 时，将返回常规 DOM 元素，但随后您调用 find ，这是要在 jQuery 元素上使用的 jQuery 方法。因此，您需要包装第一部分以返回 jQuery 元素，如下所示:

$(document.getElementById('dropPrice'))
.find('option[value="b"]').attr('selected', true);

或者，首先通过 jQuery 选择它，例如:

$('#dropPrice [value="b"]');

但是，你的第一个例子:

document.getElementById("dropPrice").value = "b";

应该可以工作。这让我想知道 PHP 回显的值是否正确和/或是否抛出其他 JS 错误而导致该代码无法运行。