如何使用JQuery和JavaScript创建更改警报的按钮?

Asad • 5 年前 • 1489 次点击

我想创建一个选择按钮。有两个选项,旅行日期和发布日期。所以当用户点击旅行日期。将有一个旅行日期的警报,反之亦然,以发出日期。我已经在选择按钮中创建了函数,但是,警报仍然不起作用?

function myFunction() {
  document.getElementById("myInput").alert("try");
}

function myFunction1() {
  document.getElementById("myButton").alert("fefetry");
}

<select class="form-control" name="insurance_id">
  <option value="" id="myInput" onclick="myFunction()">Travel Date</option>
  <option value="" id="myButton" onclick="myFunction1()">Issued Date</option>
</select>

Python社区是高质量的Python/Django开发社区
本文地址：http://www.python88.com/topic/53087

1489 次点击

文章 [ 5 ] | 最新文章 5 年前

• 1 楼

Mamun 5 年前

alert Window 方法,但您正试图在元素上访问它。

您可以尝试以下方法:

<select class="form-control" name="insurance_id"  onchange="myFunction(this)">
  <option value="" id="myInput">Travel Date</option>
  <option value="" id="myButton">Issued Date</option>
</select>

<script>
  function myFunction(sel) {
    var text = sel.options[sel.selectedIndex].text
    alert(text);
  }
  myFunction(document.querySelector('select'));
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control" name="insurance_id">
  <option value="" id="myInput">Travel Date</option>
  <option value="" id="myButton">Issued Date</option>
</select>

<script>
  $('select').change(function(){
    alert($(this).find('option:selected').text());
  }).trigger('change');
</script>

• 2 楼

Mukyuu 5 年前

你不用 onclick 在 options 但是 onchange

假设你不使用 options value

<select class="form-control" name="insurance_id" onchange="alert(this.options[this.selectedIndex].value);">
  <option value="try" id="myInput">Travel Date</option>
  <option value="fefetry" id="myButton">Issued Date</option>
</select>

或者,您可以使用 data_attributes dataset property 要获取它:

<select class="form-control" name="insurance_id" onchange="alert(this.options[this.selectedIndex].dataset.alert);">
  <option data-alert="try" value="" id="myInput">Travel Date</option>
  <option data-alert="fefetry" value="" id="myButton">Issued Date</option>
</select>

• 3 楼

Shubham Nagota 5 年前

将javascipt代码更改为

<script>
function myFunction() {
  alert("try");
}

function myFunction1() {
  alert("fefetry");
}
</script>

• 4 楼

JoHolli 5 年前

• 5 楼

Anonymous 5 年前

您可以通过监听 change 属于 select[name=insurance_id] 然后 alert 价值如下

$("select[name=insurance_id]").on("change", function(){
    alert($(this).val());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control" name="insurance_id">
        <option value="Travel Date" >Travel Date</option>
        <option value="Issued Date" >Issued Date</option>
   </select>

登录后回复