单击按钮时,如何在警报框中显示选择?(使用Javascript)

How to display the selections in an alert box when the button is clicked? (with Javascript)

本文关键字:选择 显示 Javascript 使用 按钮 单击      更新时间:2023-09-26

我做了一个带有一些选项的下拉菜单,然后放了两个标签为"a"answers"b"的单选按钮。最后我有一个按钮。。。

我想问,我怎样才能把这些联系起来?

我试着根据你的选择来判断德国队的输赢。

<select>
    <option value="England">England</option>
    <option value="Germany">Germany</option>
</select>
<form action="demo_form.asp"> 
    <label for="win">win</label>
    <input type="radio" name="gender" id="win" value="win"><br>
    <label for="lose">lose</label>
    <input type="radio" name="gender" id="lose" value="lose"><br>
</form>
<button onclick="myFunction()">click</button>
<p id="demo"></p>

HTML-

<select class="team">
<option value="England">England</option>
<option value="Germany">Germany</option>
</select>
<form action="demo_form.asp"> 
  <label for="win">win</label>
  <input type="radio" name="gender" id="win" value="win"><br>
  <label for="lose">lose</label>
  <input type="radio" name="gender" id="lose" value="lose"><br>
  </form>
  <button class="click">click</button>
<p id="demo"></p>

JS-

$(".click").click(function(){
    var team = $(".team").val()
    var outcome = $("#win").is(":checked") ? "wins" : "loses"
    alert(team + " " + outcome + "!")
})

检查所选下拉列表的值,检查哪个单选按钮被选中,然后弹出一个显示结果的警报窗口

https://jsfiddle.net/t0uh81yL/1/

使用jQuery:

function myFunction() {
    var team = $('#team').val(),
        result = $('input[name=gender]:checked').val(),
        output = result 
          ? team + ' ' + result 
          : 'Select team and result!'; 
  
    alert(output);
};
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="team">
  <option value="England">England</option>
  <option value="Germany">Germany</option>
</select>
<form action="demo_form.asp"> 
  <label for="win">win</label>
  <input type="radio" name="gender" id="win" value="win"><br>
  <label for="lose">lose</label>
  <input type="radio" name="gender" id="lose" value="lose"><br>
</form>
<button onclick="myFunction()">click</button>
<p id="demo"></p>

首先,给您选择一个ID:

<select id="country">

然后,使用这个函数,它收集值并显示Alert:

function myFunction() {
  genderIs="unselected";
  if (document.getElementById('win').checked) {
  genderIs = document.getElementById("win").value;
  }
  if (document.getElementById('lose').checked) {
  genderIs = document.getElementById("lose").value;
  }
  countryIs = document.getElementById("country").value;
  alert ("Gender: " + genderIs + "'nCountry: " + countryIs);
}

还有一件事。。。您的Select应该在表单内。没有理由在表单外。

这是一把小提琴,只是因为。。。