对javascript和select部件的结合运用

<?php

//对Javascript和select部件的结合运用
//在写程序的过程,我想实现在select对象选中选项后,
//不需要提交按钮,而直接触发动作,且在动作发生后
//的页面中要保持所选择的选项。经过形容,终于通过
//使用Javascript及select对象的onchange属性及
//value值而实现了这种功能。
//代码如下(文件名为"test.php"):

switch ($mon){
    case '': echo '请选择您的星座:';break;
    case '1':echo '您的星座是水瓶座';break;
    case '2':echo '您的星座是双鱼座';break;
    case '3':echo '您的星座是白羊座';break;
    case '4':echo '您的星座是金牛座';break;
    case '5':echo '您的星座是双子座';break;
    case '6':echo '您的星座是巨蟹座';break;
    case '7':echo '您的星座是狮子座';break;
    case '8':echo '您的星座是处女座';break;
    case '9':echo '您的星座是天平座';break;
    case '10':echo '您的星座是天蝎座';break;
    case '11':echo '您的星座是射手座';break;
    case '12':echo '您的星座是魔蝎座';break;
    default:break;
  }       
?>

<form name="form1">
  <select name="month_select"
     onChange="javascript:location.href=
                   this.options[this.selectedIndex].value">
  <option>--请选择你的星座--</option>
  <option value="test.php?mon=1"
     <?php if($mon=="1") echo " selected"; ?>>水瓶座</option>
  <option value="test.php?mon=2"
     <?php if($mon=="2") echo " selected"; ?>>双鱼座</option>
  <option value="test.php?mon=3"
     <?php if($mon=="3") echo " selected"; ?>>白羊座</option>
  <option value="test.php?mon=4"
     <?php if($mon=="4") echo " selected"; ?>>金牛座</option>
  <option value="test.php?mon=5"
     <?php if($mon=="5") echo " selected"; ?>>双子座</option>
  <option value="test.php?mon=6"
     <?php if($mon=="6") echo " selected"; ?>>巨蟹座</option>
  <option value="test.php?mon=7"
     <?php if($mon=="7") echo " selected"; ?>>狮子座</option>
  <option value="test.php?mon=8"
     <?php if($mon=="8") echo " selected"; ?>>处女座</option>
  <option value="test.php?mon=9"
     <?php if($mon=="9") echo " selected"; ?>>天平座</option>
  <option value="test.php?mon=10"
     <?php if($mon=="10") echo " selected"; ?>>天蝎座</option>
  <option value="test.php?mon=11"
     <?php if($mon=="11") echo " selected"; ?>>射手座</option>
  <option value="test.php?mon=12"
     <?php if($mon=="12") echo " selected"; ?>>魔蝎座</option>
  </select>
</form>

【本文版权归作者与奥索网共同拥有,如需转载,请注明作者及出处】

(0)

相关推荐

  • 对javascript和select部件的结合运用

    <?php //对Javascript和select部件的结合运用 //在写程序的过程,我想实现在select对象选中选项后, //不需要提交按钮,而直接触发动作,且在动作发生后 //的页面中要保持所选择的选项.经过形容,终于通过 //使用Javascript及select对象的onchange属性及 //value值而实现了这种功能. //代码如下(文件名为"test.php"): switch ($mon){     case '': echo '请选择您的星座:';brea

  • yii 2.0中表单小部件的使用方法示例

    前言 本文主要介绍的是关于yii 2.0中表单小部件使用的相关内容,分享出来供大家参考学习,下面来看看详细的介绍: 使用方法 首先创建model层,因为要使用表单小部件 所以要加载相应的组件,这里需要的组件有yii\widgets\ActiveForm yii\helpers\Html 接下来在model定义的class里 写方法,首先我们要定义需要使用表单小部件的name值 不多说上代码 <?php /** * Created by PhpStorm. * User: jinlei * Dat

  • C#使用ADO.Net部件来访问Access数据库的方法

    数据库的访问是所有编程语言中最重要的部分,C#提供了ADO.Net部件用于对数据库进行访问.我们将从最简单易用的微软Access数据库入手讨论在C#中对数据库的访问. C#中的Connection对象和Command对象与Access类似,但在这里我们还将使用其另一个与RecordSet类似的被称作ADODataReader的对象,它负责处理与查询有关的RecordSet对象. 首先,必须使用微软的Access创建一个数据库.运行Access,创建一个数据库,但不要创建任何表(我们将在下面的程序

  • 利用shell创建文本菜单与窗口部件的方法

    前言 创建交互式shell脚本最常用的方法是使用菜单.提供各种选项可以帮助脚本用户了解脚本能做什么,不能做什么;通常菜单脚本会清空显示区域,然后显示可用的选项列表.本文给大家详细介绍了shell创建文本菜单与窗口部件的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 创建文本菜单 创建交互式shell脚本最常用的方法是使用菜单,它提供了各种选项帮助脚本用户了解脚本能做到的和不能做的. shell脚本菜单的核心是case命令,该命令会根据用户在菜单上的选择来执行特定命令.

  • Android小部件Widget开发过程中的坑和问题小结

    概述 官方参考 Build an App Widget 效果图 放张效果图,这是我玩的桌面 app 文件夹 AndroidManifest.xml Receiver 切记里面的字母不要弄错,最好复制粘贴再修改相对应自定义的地方就好,一个字母的错误搞了我一天,吐血 <receiver android:name=".desktop.DesktopWidget"> <meta-data android:name="android.appwidget.provide

  • jQuery UI菜单部件Menu Widget

    目录 实例 二.图标 三.分隔符 四.键盘交互 五.主题化 六.快速导航 1.Options 2.Methods 3.Events 带有鼠标和键盘交互的用于导航的可主题化菜单. 实例 一个简单的 jQuery UI 菜单(Menu). 代码 <ul id="menu"> <li><a href="#" rel="external nofollow" rel="external nofollow"

  • php操作mysql获取select 结果的几种方法

    如果用了 MYSQL_BOTH,将得到一个同时包含关联和数字索引的数组. 用 MYSQL_ASSOC 只得到关联索引(如同mysql_fetch_assoc() 那样), 用 MYSQL_NUM 只得到数字索引(如同 mysql_fetch_row 那样). 1. mysql_fetch_array($rs,MYSQL_ASSOC) [@test01 model]# php test.php Array ( [name] => hellokitty [addr] => i dont kno )

  • jquery select插件异步实时搜索实例代码

    一.先看看效果. 二.做此插件的原因. 1.数据量过大(几千.几万条),无法一次性全部加载. 2.现有插件各不相同,无法满足功能需求. 3.美观性,可控性不足. 三.如何使用. 1.html和js <select id="unit"></select> <script type="text/javascript" src="/demo/thirdparty/jquery/jquery-1.8.3.min.js">

  • JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参

    复制代码 代码如下: <script src="jquery.min.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> $(document).ready(function(){ $('#mySelect').change(function(){ alert($

  • AngularJS实现的select二级联动下拉菜单功能示例

    本文实例讲述了AngularJS实现的select二级联动下拉菜单功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html ng-app> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <script src="../script/angular.js"

随机推荐