Question

我想根据所选值打印一个值，无需提交，也无需重新加载页面

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
 $("#select").on("change", function() {
  //alert("Welcome to " + $(this).val());
    $('#text').html("Welcome to " + $(':selected').text())
}).trigger('change'); //trigger on page load

</script>
<select id="select">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
<div id="text"></div>

我想打印如果选择的值是奥迪，那么它将打印欢迎来到Aundi像智慧没有重新加载和没有提交

Answer 1

试试这个： -

＆＃13;

$("#select").on("change", function(){
   $('#text').html("Welcome to " + $(':selected').text())
}).trigger('change'); //trigger on page load

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="select">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
<div id="text"></div>

＆＃13;

Answer 2

you can use angular JS 

see following plunker for reference

your HTML
<html ng-app="myApp">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>

  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.js"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MyController">
  <input type="checkbox" ng-model="myCheckbox" ng-change="cbSelected()" />
  <input type="text" ng-model="text1" readonly />
  <input type="text" ng-model="text2" ng-readonly="!myCheckbox" />
  <h3> {{text2}}</h3>
</body>

</html> 


App.js
ngular.module('myApp', [])
.controller('MyController', function($scope) {

  $scope.text1 = 'some-text';

  $scope.cbSelected = function() {
      if ($scope.myCheckbox) {  // when checked
        $scope.text2 = angular.copy($scope.text1);
      } else {
        $scope.text2 = "";
      }
  };
});

Customise according to your requirement 
http://plnkr.co/edit/vURMjLxArLsRSKZj5o9q?p=preview

Answer 3

$('select[name=nameOfSelect]').change(function() { alert("welcome to " + $(this).val()); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<select name="nameOfSelect"> 
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

使用.val获取所选选项的值。见下文，

<select>将是

<select name="nameOfSelect">

然后使用。

$('select[name=nameOfSelect]').change(function() { alert("welcome to " + $(this).val()); });

希望它有所帮助...... :)

根据选择打印值

3 个答案: