可编辑的select框的实现(实用版)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN">
< HTML>
 < HEAD>

 < TITLE>可编辑select</TITLE>

  < script>
     function
selShiftDesc(desc){
   
if(desc.options.selectedIndex!=0){
    var
v=desc.value;
    var
t=desc.options[desc.options.selectedIndex].text 

    var i= document.getElementByIdx_x_x_x("i");

    var n= document.getElementByIdx_x_x_x("n");

    i.value=t;
    n.value=v;

    }
  }
  function c(){
 
 var t  = document.getElementByIdx_x_x_x("i").value;

   alert(t);
  }
  </script>

 < /HEAD>

<BODY>

           
< div style="position:relative;">  

              
< span
style="margin-left:100px;width:18px;overflow:hidden;">

            
< select id =‘r‘ style="width:118px;margin-left:-100px"
onchange="selShiftDesc(this);">

       < Option
value=-1>-请选择-</option>

       < Option
value=1>n1</option>

       < Option
value=2>n2</option>

       < Option
value=3>n3</option>

       < Option
value=4>n4</option>

       < Option
value=5>n5</option>

       < Option
value=6>n6</option>

       < Option
value=7>n7</option>

       < Option
value=8>n8</option>

       < Option
value=9>n9</option>

       < /select>

      < /span>

           
< input id="i" type=‘text‘ name="newswriter.notes"
style="width:100px;position:absolute;left:0px;"/>

< /div>

< input type=‘button‘
id="b" value=‘提交‘onclick="c();"/>
 < /BODY>

< /HTML>

时间： 2024-10-11 17:29:23

可编辑的select框的实现(实用版)的相关文章

select框宽度与高度设置(实用版)

在IE中只能使用 font-size: 限制 select 的高度. 同时使用 width:200px 限制宽度 size="20" 表示最多显示20个选项,超过20的需要拖动滚动条显示. multiple 表示 select 可多选 < select size="20" style="width:200px;font-size:12px" multiple> </select> select框宽度与高度设置(实用版)

HTML可编辑下拉框

<div style="position:relative;">   <select style="width:120px;" onchange="document.getElementById('input').value=this.value">     <option value="A类">A类</option>     <option value="B类&

可编辑下拉框的2种实现方式_javascript技巧_

可编辑的下拉框一.  <div style="position:relative;"> <select style="width:120px;" onchange="document.getElementById('input').value=this.value"> <option value="A类">A类</option> <option value="B类

用纯css改变下拉列表select框的默认样式（不兼容IE10以下）

在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 事情是这样的,您的设计师团队向您发送一个新的PSD(Photoshop文档),它是一个新的网站的最终设计. 一切看起来很好,很正常,直到你看到他/她设计的一个选择下拉框跟浏览器默认提供的样式有些不同!你说:“这没办法做!你应该不会抱怨设计师,其实更改下拉输入的默认样式并不是非常难的! 下面是解决方案. 我们看到默认的下载选择框在firefox和chrome中是有些不同的 Chrome 和 Firefox 中分

将option添加到select框

var select=document.createElement("select"); select.setAttribute("class","field size2"); // 从隐藏的选择框里找选项 var hideSelect=document.getElementById("hideSelect"); for(var i=0;i<hideSelect.options.length;i++){ var op=d

下拉框&mdash;&mdash;把一个select框中选中内容移到另一个select框中遇到的问题

在使用jQuery实现把一个select框中选中内容移到另一个select框中功能时遇到了一个问题,就是点击按钮时内容可以到另一个select框中,但是到了另一个select框中的内容却很快闪退回原来的select框中,代码如下:                  <select class="select1" name="select1" multiple="multiple">                     <op

如何在两个级联关系的select框下再append几个（待解决）

今天遇到问题了,在这里标记一下,解决了的话就更新 描述:有行为和操作两个枚举,每个行为有对应的操作,在选择行为之后,就能够选择对应的操作.产品提了个需求,加一个添加按钮,点一次就能在原来的select框下新增第二个行为和操作框,并且也是级联关系.由于js只会一些基本的东西,还没有想到好的解决方法.

jQuery打造智能提示插件二（可编辑下拉框）

在上一篇 jQuery打造智能提示插件 上改进,增加下拉按钮,修复点击下拉区域外不隐藏BUG 效果 下拉按钮素材: js封装,注意红色部分为BUG修复,然后传入boxwidth不带px: /* /// <reference path="jquery-autocomplete2.0.js" /> zhangs 20140516 */ (function($) { $.fn.combox = function(options) { var KEY = { UP: 38, DOW

浅谈jquery关于select框的取值和赋值

浅谈jquery关于select框的取值和赋值 jQuery("#select_id").change(function(){}); // 1.为Select添加事件,当选择其中一项时触发 var checkValue = jQuery("#select_id").val(); // 2.获取Select选中项的Value var checkText = jQuery("#select_id :selected").text(); // 3.获取