精华内容
下载资源
问答
  • javascript-获取用户选中文本框内容

    千次阅读 2018-05-02 13:59:14
    用户选中文本框内容 用户选中文本框内容 概述 技术实现 代码如下 概述 在日常开发中,什么时候需要监听用户在文本框中输入的内容?富文本编辑器就是一个典型的例子。 技术实现 HTML5在扩展方案...

    用户选中的文本框内容

    概述

    在日常开发中,什么时候需要监听用户在文本框中输入的内容?富文本编辑器就是一个典型的例子。
    

    技术实现

    HTML5在扩展方案中对文本框提供2个属性:selectionStart和selectionEnd(即文本选区开头和结尾的偏移量)。如此,就可以通过这2个属性截取文本框的文本,获取用户真正选中的文本。
    IE8提供了一个document.selection对象,能获取整个文档被选中的文本。不过,配合select事件一起使用,就能获取用户选中的文本。我们需要用到范围range,利用范围获取文本。
    

    代码如下

    <form name="myform">
        <label for="name">姓名:</label>
        <input type="text" name="name" autofocus id="name" placeholder="请输入姓名" value="嘿哈"><br>
        <label for="note">备注:</label>
        <textarea id="note" placeholder="请输入备注" maxlength="3">递四方</textarea><br>
        <button name="自定义按钮">自定义按钮</button><br>
    </form>
    <script>
        (function(){
            var form = document.forms['myform']
            var elements = form.elements
            var inputText = elements['name']
    
            // 监听文本框的select事件
            EventUtil.addHandler(inputText, 'select', function(event){
                event = EventUtil.getEvent(event)
                var target = EventUtil.getTarget(event)
                alert(getSelectedText(target))
            })
    
            // 跨浏览器获取用户在文本框中选中的文本
            function getSelectedText(textbox){
                if (typeof textbox.selectionStart === 'number') {   
                    // IE9及以上,其他常用浏览器
                    return textbox.value.substring(textbox.selectionStart, textbox.selectionEnd)        
                } else if (document.selection) {
                    // IE8
                    return document.selection.createRange().text            
                }
            }
        })()
    </script>
    展开全文
  • 本文实例讲述了jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法。分享给大家供大家参考,具体如下: 一、先描述下可以实现什么: 下拉框一改变,弹出框出现,选择弹出框中的会赋值给下拉菜单 二、代码: ...
  • 今天我们来看看怎么实现网页文本框选中时高亮显示文本框以提醒当前正在输入的文本框。 效果: 当我们选中文本框时,文本框背景颜色变为深蓝色。 实现思路: 用js为文本框注册onfocus获得焦点事件,在获得焦点...

                               Javascript特效之高亮显示选中的文本框

    今天我们来看看怎么实现网页文本框选中时高亮显示文本框以提醒当前正在输入的文本框。

    效果:

    当我们选中文本框时,文本框背景颜色变为深蓝色。

    实现思路:

    用js为文本框注册onfocus获得焦点事件,在获得焦点事件触发时添加写好的高亮样式即可。

    js代码:

    var currentlyActiveInputRef = false;
    var currentlyActiveInputClassName = false;
    function highlightActiveInput()
    {
    	if(currentlyActiveInputRef){
    		currentlyActiveInputRef.className = currentlyActiveInputClassName;
    	}
    	currentlyActiveInputClassName = this.className;
    	this.className = 'inputHighlighted';
    	currentlyActiveInputRef = this;
    	
    	
    }
    function blurActiveInput()
    {
    	this.className = currentlyActiveInputClassName;
    	
    	
    }
    function initInputHighlightScript()
    {
    	var tags = ['INPUT','TEXTAREA'];
    	
    	for(tagCounter=0;tagCounter<tags.length;tagCounter++){
    		var inputs = document.getElementsByTagName(tags[tagCounter]);
    		for(var no=0;no<inputs.length;no++){
    			if(inputs[no].className && inputs[no].className=='doNotHighlightThisInput')continue;
    			
    			if(inputs[no].tagName.toLowerCase()=='textarea' || (inputs[no].tagName.toLowerCase()=='input' && inputs[no].type.toLowerCase()=='text')){
    				inputs[no].onfocus = highlightActiveInput;
    				inputs[no].onblur = blurActiveInput;
    			}
    		}
    	}
    }

    用js实现比较麻烦。我们来看看怎么用jquery实现:

    我们先引入jquery文件后。用两段代码即可实现:

    $("input,textarea").focus(function(){
    	$(this).addClass("inputHighlighted");
    });
    $("input,textarea").blur(function(){
    	$(this).removeClass("inputHighlighted");
    });

    为所有文本框和文本域注册获得焦点事件和失去焦点事件。然后分别为当前元素this添加和去除高亮的样式即可。

    这里还有一点说明,如果是在focus事件里面用alert会无限弹出消息,因为先执行了focus再显示alert 结果造成了焦点转移.

    展开全文
  • html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content=
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    <script type="text/javascript" src="jquery-2.1.1.js"></script>
    <body>
    
    
    
    <input type="text"  id="context"/>
    <input  type="button" id="zs" value="获取点击事件的val()"/>
    
    <select id="txt">
    <option value="0">option1</option>
    <option value="1">option2</option>
    <option value="2">option3</option>
    
    </select>
    
    <br/>
    <a href="http://zhannei.baidu.com/cse/search?q=java%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84&click=1&entry=1&s=1841543737020962857&nsid=">java123</a>
    <br/>
    <br/>
    <a href="http://www.java1234.com/">java网站---->>>$("[href]").css("background-color","#C06");</a>
    
    <br />
    <br />
    <a href="#">href=#--->>$("[href='#']").css("background-color","#C06");</a>
    
    <p></p>
    <h1></h1>
    
    <script>
    $("#zs").click(function(){
       var context=$("#context").val();
       $("p").html("<h1>"+context+"</h1>");
       })
       $("#txt").change(function(){
          var val=$("#txt option:selected").val();
            console.log("22--->>>"+val);
          $("h1").html(val);
          })
          //属性选择器
          //$("[href]").css("background-color","#C06");
          $("[href='#']").css("background-color","#C06");
          
          $("[href$='com']").css("background-color","#C06");
    
    
    </script>
    
    
    </body>
    </html>
    
    展开全文
  • 主要介绍了html下拉菜单提交后如何保留选中值而不返回默认值,方法虽简单,但比较实用,需要的朋友可以参考下
  • 要完成的功能:点击ListBox选中一个或多...你原先错误的思路:ListBox配置好数据源,然后在TextBox的后台事件TextBox1_TextChanged中写入方法获取ListBox中被选中项的数量的。 正确思路:1.此功能是点击ListBox控...

    要完成的功能:点击ListBox选中一个或多个选项时,TextBox中自动显示选中项的数量。

    如下图显示:

                              

    分析:

    你原先错误的思路:ListBox配置好数据源,然后在TextBox的后台事件TextBox1_TextChanged中写入方法获取ListBox中被选中项的数量的值。

    正确思路:1.此功能是点击ListBox控件引发的事件,ListBox是主动,TextBox是被动,所以是ListBox主动传值给TextBox,而不是TextBox去获                 取ListBox选中项数量的值。所以应该是在ListBox的后台事件ListBox1_SelectedIndexChanged中写入方法。

                  2.赋值等式的左边不能是方法体,只能是参数或变量名。如不能写成Convert.ToInt32(TextBox1.Text)=ListBox1.Items.Count;

                    而写成TextBox1.Text=ListBox1.Items.Count+"";(这样左右都为string类型)

                  3.ListBox只能获取项目的总数量ListBox1.Items.Count,而无法通过函数直接获取被选中项目的总数量。因而需要通过for循环判断每                   项是否被选中,且设置一个int型变量count计数。

    正确代码如下:

                  

    protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e)
        {
            int count = 0;
            for (int i = 0; i < ListBox1.Items.Count; i++)
            {
                if (ListBox1.Items[i].Selected)
                {
                    count++;
                }
            }
            TextBox1.Text = count + ""; //等式两边均为string类型
        }

     

     

                              

    转载于:https://www.cnblogs.com/xyhy-sxh/p/4205802.html

    展开全文
  • Asp.net mvc2中根据选中多个CheckBox,让文本框显示选中内容的javascript脚本
  • Untitled Document function changeIt(){ text1.value += select1.options[select1.selectedIndex].value+","; //text1.value += document.getElementById(select1).value+","; alert(text1.value);
  • 1.页面显示 ![图片说明](https://img-ask.csdn.net/upload/201712/02/1512204727_352480.png) 2.HTML: ![图片说明](https://img-ask.csdn.net/upload/201712/02/1512204965_176697.png) 3.js: ![图片说明]...
  • 比如: 文本框1 输入的为 12345 ,文本框2原本的为"789",然后再把文本框1 的12345 给加上去,文本框2的为78912345,当文本框1的12345 删除后,文本框2 的应该显示为 789 ,我要实现这个效果,不知道我描述...
  • JavaScript | 选中并获取多行文本框内容的效果 本文主要内容 1. 目标效果展示 2. 涉及的基本属性知识 3. 核心功能-选取的相关知识 1. 目标效果展示 如上,主要实现的是用户自定义选择多行文本框中的任何...
  •  可以看到,我们使用collapse(false)结合select方法可以很方便的把光标focus到文本框的末尾。 还有一个 move方法   var range = input.createTextRange(); range.moveStart("character",2); range....
  • procedure TForm1.Edit1Change(Sender: TObject); begin ClientDataSet1.Locate('班级编号',trim(edit1.Text),[lopartialkey]); end;
  • 今天做到一个,需要将下拉框中的传递到特定的文本框中,其实就是一个很简单的前台js操作,但是由于好久没有使用js了,很生疏。具体如下: 这是一个测试页面,目的是点击申请人名字后,在项目名称文本框中把名字...
  • 在两个文本框中输入计算加减乘除法结果显示在另一个文本框中。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta ...
  • 您可以将对象放入数组中,以选择向最终用户显示内容的位置,并获得除文本框显示以外的其他。 数组的格式应如下所示。 var arr = [ { id: '1', name: 'Icecream' }, { id: '2', name: 'Chocolate' }, { id:...
  • Before You Begin 在你开始之前 Sometimes it's necessary to process some logic on the client side through JavaScript instead of causing a full-...注意到每个文本框已经填充了相应的    
  • 下拉选择能打印到数据,但是选中后框里不显示值; 原因: 出现这个问题 是因为下拉框数据是v-for接口请求来的数据,因为数据层次太多,render函数没有自动更新 解决方法: 在chenge事件里手动强制刷新 上代码: <...
  • 初始" size="30" name="get" id="get"> <!-- google_ad_client = "pub-2947489232296736"; /* 728x15, 创建于 08-4-23MSDN */ google_ad_slot = "3624277373"; google_ad_width = 728; google_ad_...
  • 选中的radio的在button中显示 代码如下: <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></...
  • 把下拉框的赋值到文本框

    千次阅读 2019-06-28 08:13:41
    而是通过选中省份、城市、地区的然后自 动生成的,就是下拉框的然后再赋值到家 庭地址的文本框内。 可以参考我下面的写法: var selectValue = $(’#provincename option:selected’).text(); var Chengshi ...
  • htlm:js:效果:
  • 默认下拉框效果图: 当选择其他订购厂家的时候效果: &lt;script&gt; function show(obj) { document.getElementById("other").style.display=(obj.value==0)?"... ..
  • <textarea></textarea>用来创建一个可以输入多行的文本框,此标志对用于<form>... (8)wrap属性 定义输入内容大于文本域时显示的方式,可选如下: *默认值是文本自动换行;当输
  • C#中 例如: private void button1_Click(object sender, EventArgs e) { textBox1.Text="1111"; textBox1.Text = "2222"; } 点击按钮后,文本框里面只有2222,1111看不到... 怎么让1111显示,2222也显示
  • 1、使用JavaScript 的 onchange方法 2、需要写JavaScript代码 <script language="JavaScript"> function change(value) { if(value=="金融类" || value=="计算机类" || value=="哲学类" || value=="文学类...
  • 示例1:示例2:Demo下载(兼容IE、火狐、谷歌):点击下载基本的认识: 文本选中区域光标:页面中闪烁的光标其实就是特殊的宽度为0的选区。 简单理解就是选区的左右边界交叉形成了光标。 有了这个概念下面的内容就很...
  • 点击复选框,将复选框的在text文本框显示      function result(form) {  var a = document.getElementById("txt");  a.value = "";  for (var i = 0; i  var e
  • <div><input type='button' onclick="doS()" value="显示选中的文字"/></div> <textarea id="inTextarea" cols='60' rows='10'></textarea> 转载于:...
  • ``` <span class="caret"></span> <li><a href="#">学一</a></li>...这是一个下拉框,想问一下这样的下拉框,如何用js或者jq实现点击下拉框的一个li然后这个li的内容显示文本框里面~谢谢

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 45,030
精华内容 18,012
关键字:

显示文本框值选中