Question

我有一个选择，输入和一个按钮，我希望当我点击按钮在警报中添加选项值和输入值时，我设法做到但是在改变时只有选择，如何我可以在同一个警报中获取选择和输入值吗？这是我的代码：

＆＃13;

$('select').on('change', function() {
  alert( this.value );
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select>
    <option value="1">One</option>
    <option value="2">Two</option>
</select>
<input type="text" value="Input">
<button type="button">Get value</button>

＆＃13;

Answer 1

请尝试以下操作：

NameError: name 'IMAGES_DIR' is not defined

您可以使用其他方式代替$('#myButton').on('click', function() { var text = $('#myInput').val() + ' ' + $('#mySelect').val(); alert(text); }) <select id="mySelect"> <option value="1">One</option> <option value="2">Two</option> </select> <input id="myInput" type="text" value="Input"> <button id="myButton" type="button">Get value</button>绑定，例如id，$('button')和$('select')。您可以显示所选的选项文字$('input')。

，而不是选定的选项value属性

Answer 2

事件函数中的

this不是jquery对象，它是一个dom对象。将其称为$(this)，即JQuery对象。

事实上

this.value - 在JS中访问的方式，没有jQuery
$(this).val() - 这是在jQuery中访问值的方式

$('select').on('change', function() {
  alert( $(this).val() );
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select>
    <option value="1">One</option>
    <option value="2">Two</option>
</select>

<button type="button">Get value</button>

Answer 3

main

这将适用于所有选择，但仅提醒当前选定的值。 e 是事件

Answer 4

当您点击按钮时，会针对所选的选项进行提醒，并显示该值。

$('select').on('change', function() {
  console.log( $(this).val() );
})

$('button[type="button"]').on('click', function(){
    alert($('select').val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select>
    <option value="1">One</option>
    <option value="2">Two</option>
</select>

<button type="button">Get value</button>

Answer 5

单击按钮时将运行以下代码。它将使用所选选项弹出消息。如果要显示数据中的所有值，请删除选项：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
$(document).ready(function() { 
  $('button').click(function() { 
      alert($('select option:selected').text());
  });
});


</script>
<select>
    <option value="1">One</option>
    <option value="2">Two</option>
</select>

<button type="button">Get value</button>

＆＃13;

Answer 6

最好调用onClick函数并传递目标元素Id以获取值。

<!DOCTYPE html>
<html>
<body>

<select id="select">
    <option value="1">One</option>
    <option value="2">Two</option>
</select>

<button type="button" onclick="getValue('select')">Get value</button>

<script>
function getValue(e) {
    var targetElement = document.getElementById(e);
    var alertValue = targetElement .options[targetElement .selectedIndex].text;
    alert(alertValue);
}
</script>

</body>
</html>

单击按钮获取选择和输入值

6 个答案: