【问题标题】:Javascript - Change selected optionsJavascript - 更改选定的选项
【发布时间】:2018-01-23 01:49:10
【问题描述】:

我有一个下拉选择菜单,其中每个选项都是从 php 代码中获得的,如下所示:

<div align = "center">
    <p>
         <select class="selectpicker" name="select_Parti[]" id="parti_list" multiple>
              <?php 
                    if($res_Participates){
                          while($tuplo = mysqli_fetch_array($res_Participates)){
                                $Nome_Parti     = $tuplo["Nome"];
                                $Email_Parti    = $tuplo["Email"];
              ?>
                                <option value = <?php echo $Nome_Parti . ", " . $Email_Parti?>><?php echo $Nome_Parti . ", " . $Email_Parti?></option>
                                <?php
                          }
                    }
                                ?>
         </select>
    </p>
</div>

我在另一个菜单中有一个 onchange 函数,当它被调用时,我想按照给定的标准设置选定的选项。问题是我无法设置从被调用函数中选择的任何选项。我尝试了很多方法,例如:

document.getElementById('parti_list').value = 'Joana Cunha, Joana@outlook.com';

我知道之前有人问过这个问题,但我找到的答案都没有奏效。有什么建议吗?

谢谢

编辑:请注意,这个问题与我的不同。[Get selected value in dropdown list using JavaScript?

在我的情况下,我从一个没有选择选项的下拉菜单开始,并且我无法在 js 脚本中将选项设置为选中。

编辑

所以我发现该选项正在按我的意愿被选中,但它只会在我选择另一个选项时改变它的状态。例如,如果我这样做

document.getElementById("parti_list").options[1].selected = true;

在我的 onchange 函数上,当它被调用时,我的选项 1 不会更改为选中,但如果我手动打开下拉菜单并选择例如选项 0,0 和 1 都会显示为选中状态。知道如何解决这个问题吗?也许我缺少一些刷新功能,所以选项 1 会自动更改为选中

【问题讨论】:

标签: javascript php html select onchange


【解决方案1】:
<select id="list">
  <option value="v">Volvo</option>
  <option value="s">Saab</option>
  <option value="o">Opel</option>
  <option value="a">Audi</option>
</select>

<script>
  document.getElementById("list").options[1].selected = true;
  // this sets "saab" option as true.
  // or...
  document.getElementById("list").value = "s"; // ID, not innerHTML.
</script>

试试看:jsfiddle

【讨论】:

  • 第二个选项基本上是我在帖子中引用的那个不起作用。您提供的第一个解决方案也非常有帮助,但不适用于这种情况。它应该工作!我做到了: document.getElementById('parti_list').option[0].selected = true;因此,当我更改下拉菜单上的值时,它应该选择第一个选项,但它没有发生
  • 这是选项[0],而不是选项[0]。我建议学习有关 javascript 和 DOM 操作的基本在线教程。第一个有效,正如您在 jsfiddle 中看到的那样。您呈现的 html 可能在某处损坏。使用 Chrome 开发工具来查看 html 源代码是如何编译的,而不是发布在不完全了解原始代码的情况下无法解释的原始 PHP 源代码。您要求的是 javascript/DOM 操作建议,而不是 PHP 调试。请发布 HTML 代码,而不是 PHP 源代码,它可能会或可能不会从您的服务器正确呈现为 HTML。
  • 请查看我对帖子的最后编辑。我发现了问题所在
  • 请注意,仅当您更改菜单上选择的选项时才会触发 onchange。也就是说,如果在带有 onchange 回调的菜单中选择了“a”,当您按下它并再次选择 a 时,它不会触发。您需要选择 b 或其他内容。它在“更改”上,而不是在“点击”上
  • 但是我的 onchange 函数来自另一个下拉菜单,而不是我遇到问题的那个。基本上我有 2 个下拉菜单。当我更改第一个中的选定选项(定义了我的 onchange 函数)时,我想更改第二个下拉菜单中的选定选项
【解决方案2】:

var select = document.getElementById('foo')

foo.value = 'zoo, zoo'

console.log(foo.value)
<select name="foo" id="foo" multiple>
    <option value="bar, bar">bar, bar</option>
    <option value="zoo, zoo">zoo, zoo</option>
</select>

尝试将&lt;option value = &lt;?php echo $Nome_Parti . ", " . $Email_Parti?&gt;&gt;&lt;?php echo $Nome_Parti . ", " . $Email_Parti?&gt;&lt;/option&gt;修改为&lt;option value="&lt;?php echo $Nome_Parti . ', ' . $Email_Parti?&gt;"&gt;&lt;?php echo $Nome_Parti . ", " . $Email_Parti?&gt;&lt;/option&gt;,我不擅长php:(。

希望有帮助。

【讨论】:

  • 看编译后的HTML结构,不要用PHP代码。
  • 我认为这个建议确实有帮助。我注意到一件事,我正在将选项的值定义为“Nome_Parti,Mail_Parti”的串联。但是想象一下,Nome_Parti 等于,例如,“Joana Cunha”,两个词。当我做 value = Joana Cunha 时,html 没有考虑第二个词。因此,值将是 Joana,然后出现在代码“Cunha”中,编译器不知道这意味着什么。有解决这个问题的想法吗?我不知道我是否解释得足够好
  • 我用你的建议解决了这个问题,得到 " 之间的 php 行。HTML 现在已经将值视为所有句子。但它仍然不起作用
  • 看编译出来的HTML是不是你指定值的选项值。
  • 尝试删除选择多个属性。
猜你喜欢
  • 1970-01-01
  • 2015-05-24
  • 2016-04-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-12-16
相关资源
最近更新 更多