根据所选内容打印值

Print the value based on selection

本文关键字：打印      更新时间：2023-09-26

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

    <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 就像明智地没有重新加载和提交一样

试试这个：-

$("#select").on("change", function(){
   $('#text').html("Welcome to " + $(':selected').text())
}).trigger('change'); //trigger on page load
<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>

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


$('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()); });

希望对您有所帮助..:)

相关文章：