以jQuery形式出现.change函数问题 [英] Issue with .change function in jQuery form

问题描述

我正在编写一个脚本，根据选择菜单中的用户输入更改范围文本值。

I am working on a script that changes the span text value depending on user input in the select menu.

我的当前脚本有问题。如何修复它，以便当我单击结束日期然后再次单击开始日期时，它会在跨度中显示开始日期？

I have a fault with my current script. How do I fix it so when I click 'End Date' and then click 'Start Date' again, it displays 'Start Date' in the span?

演示：< a href =http://jsfiddle.net/197ncb10/ =nofollow noreferrer> http://jsfiddle.net/197ncb10/

$(function() {
  $('#usertype').change(function() {
    $(this).next("span").text("End Date");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="post">
  <input type="hidden" id="myhidden3" name="quantity" value="1" />
  <select id='usertype'>
        <option value='1'>Start Date</option>
        <option value='2'>End Date</option>
        <option value='3'>End Date</option>
      </select>
  <span>Start Date</span>
</form>

推荐答案

这样做

$(function() {
  $('#usertype').change(function() {
     $(this).next("span").text($('#usertype option:selected').text());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="post">
  <input type="hidden" id="myhidden3" name="quantity" value="1" />
  <select id='usertype'>
        <option value='1'>Start Date</option>
        <option value='2'>End Date</option>
        <option value='3'>End Date</option>
      </select>
  <span>Start Date</span>
</form>

这篇关于以jQuery形式出现.change函数问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！