对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"
     >
  <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>

时间: 2024-12-09 20:33:16

对Javascript和select部件的结合运用的相关文章

对&amp;#106avascript和select部件的结合运用_php基础

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

用javascript实现select的美化

javascript|select 论坛经常有人会问到用CSS如何美化Select标签,其实但凡你看到很酷的都是用javascript来实现的.昨天试着做了一下,基本实现的初级功能.拿出来和大家一起分享一下.先可以看一下预览效果:http://www.iwcn.net/demo/select 功能需求 1.调用要方便,做好之后应该像这样: function loadSelect(selectobj){//传入一个select对象就能将他的样式美化} 2.不改变原有表单项,表单的页面代码不去破坏:

javascript获取select值的方法分析

  本文实例讲述了javascript获取select值的方法.分享给大家供大家参考.具体分析如下: 1. 获取显示的汉字 代码如下: document.getElementById("bigclass").options[window.document.getElementById("bigclass").selectedIndex].text 2. 获取数据库中的id 代码如下: window.document.getElementById("bigc

javascript获取select的当前值示例代码

 本篇文章主要介绍了javascript获取select的当前值示例代码(兼容IE/Firefox/Opera/Chrome) 需要的朋友可以过来参考下,希望对大家有所帮助 JavaScript获取Select当前值写法: var value = document.getElementById("select").options[document.getElementById("select").options.selectedIndex].value; var t

javascript操作select元素实例分析

 这篇文章主要介绍了javascript操作select元素的方法,可实现针对select元素选中元素时动态改变html元素的技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了javascript操作select元素的用法.分享给大家供大家参考.具体分析如下: 这里熟悉一下js对select元素的操作,html页面中建立一个form,其中包含一个select元素和submit按钮. 当选择select中某一项时改变其文字,当select中所有项的文字都改变后,重新恢复它们.

JavaScript通过select动态更换图片的方法

 这篇文章主要介绍了JavaScript通过select动态更换图片的方法,涉及javascript动态操作图片src的技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了JavaScript通过select动态更换图片的方法.分享给大家供大家参考.具体分析如下: 下面的JS代码在select列表变化时触发SetBeerIcon()函数,SetBeerIcon()函数可以根据select选择的值动态修改图片 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14

javascript中select的赋值问题?

问题描述 javascript中select的赋值问题? 一开始给select赋初始值,但是点击某一方法之后将会给select增加一个数组.那我怎么把一开始给select赋初始值给去掉呢? 解决方案 直接用$(""#select"").html('');如果要动态添加,需要你自己组成 var html = '<option value=""1"">test</option><option valu

用javascript实现select的美化的方法_表单特效

用javascript模拟select达到美化效果 用户注册 帐号 密码 省份 江西福建广东浙江 作者博客

JavaScript操作select元素和option的实例代码_javascript技巧

废话不多说了,直接给大家贴代码,具体代码如下所示: <!DOCTYPE html PUBLIC "-//WC//DTD XHTML . Transitional//EN" "http://www.w.org/TR/xhtml/DTD/xhtml-transitional.dtd"> <html xmlns="http://www.w.org//xhtml"> <head> <title></t