js 下拉框获取焦点后 ,自动展开选项内容?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js 下拉框获取焦点后 ,自动展开选项内容?相关的知识,希望对你有一定的参考价值。

不是切换,不是其他,就是一个下拉框内容自动展开的功能!

参考技术A
楼上的17kxx_com,楼主用的是 textbox服务器端控件 -_-||,

有两种方法
1.js脚本方式
2.使用服务器端控件,也就是textbox控件的onchange事件,但是这个是会回发的.

这个需求最好使用纯前台脚本(html+javascript)实现,不建议使用asp.net 服务器端控件的服务端事件(因为会回发,也就是页面会刷新一次,比较难看),下面是方法1的实现代码:
<asp:TextBox ID="txtA" onblur="changetText()" ....>
<asp:TextBox ID="txtB" ..........>
textbox对应会生成 相应的html代码.
然后javascript函数
<script>

function changetText()

document.getElementById("txtB").value=document.getElementById("txtA").value


</script>
不涉及后台代码。
以下为全部代码(通过测试)

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

<html xmlns="" >
<head runat="server">
<title></title>

<script>

function changetText()
document.getElementById("txtB").value = document.getElementById("txtA").value;



</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtA" runat="server" onblur="changetText()"></asp:TextBox>
<asp:TextBox ID="txtB" runat="server"></asp:TextBox>

</div>
</form>
</body>
</html>
本回答被提问者采纳

React - 当输入框获取焦点时自动选中输入框中的内容

在工作中遇到一个当输入框获取焦点时自动选中输入框中的内容这么一个小功能,这里记录下,实现其实很简单,如下所示.


import React from "react";
// 当聚焦到A输入框后,选中该输入框中的值
export default class App extends React.Component 
  constructor(props) 
    super(props);
    this.txt = 
      curren: null,
    ;
  
  // 当A输入框聚焦后触发
  focus_handler = (e) => 
    // 获取输入框中的值
    const value = e.target.value;
    // 设置选中输入框中的全部文本
    this.txt.setSelectionRange(0, value.length);
  ;
  getARef = (el) => 
    this.txt = el;
  ;
  render() 
    return (
      <div>
        <input
          type="text"
          placeholder="A输入框"
          ref=this.getARef
          onFocus=this.focus_handler
        />
      </div>
    );
  


以上是关于js 下拉框获取焦点后 ,自动展开选项内容?的主要内容,如果未能解决你的问题,请参考以下文章

vue如何获取输入框失焦绑定的值?

关于js中事件监听的问题(文本框 回车键 失去焦点)

如何用JS选中下拉框选项

js 输入框获取焦点显示div 失去焦点隐藏div 点击div也消失了怎么解决

JQuery下focus()无法自动获取焦点的处理方法 jquery如何使文本框获得焦点

React - 当输入框获取焦点时自动选中输入框中的内容