当选择了“选择”下拉列表中的选项时,将显示模式

modal appearing when option from select dropdown has been selected

本文关键字:选择 显示 模式 选项 下拉列表      更新时间:2023-09-26

WEll,

如果选择了选择下拉列表中的选项之一,我正在尝试显示一个模式窗口。如果不使用选择中的选项,我使用一个简单的按钮,但它确实有效,但我需要从选择中使用它。

屏幕变化虽然不透明,所以我想我正在做一些事情......但错了。显然,我有我需要的引导程序的链接和脚本,也打开和关闭文档和 html。

有什么建议吗?

谢谢

html
------------------------------------------------------------------------
    <select id="selectAction" data-style="btn-info" onchange="newGraph(this)">
        <option value="" disabled selected>Select your option:</option>
        <option value="create">Create a new graph</option>
        <option value="recall">Recall a saved graph</option>
      </select>
      <!--Pop up window-->
      <div data-toggle="modal" data-target="#popUp1">   //it works if I put this in a <button> instead a div, but then, I have to click to button to make the modal to work so it in not what I want.
<div class="modal hide fade" id="popUp1" tabindex="-1" role="dialog" aria-labelledby="popUp1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4>Creating a new graph:</h4>
      </div>
      <div class="modal-body">
        <p>Here some text</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-success">Save changes</button>
      </div>
    </div>
  </div>
</div>
    </div> 

script
--------------------------------------------------------------------------------
function newGraph(element) {
  if($(element).val() === 'create') {
     $('.toolsHeader').show();
     $('#popUp1').modal();
      $('#selectAction').hide();
  }
   else{ 
    return false;
  }};

从 HTML 中删除这个:onchange="newGraph(this)"

添加这个:

$('#selectAction').change(function() {
    newGraph($(this));
});

到JS。