js控件,下拉菜单

要求输入框点击出现下拉菜单,并实现以下功能:

1.首先点击地点标签页,选择好地点;

2.自动显示相应节点标签页显示节点信息,选择好节点

3.自动显示相应的连接点,选择连接点,连接点被选中并被传送的输入框input控件中

制作了该控件的jquery插件,格式采用bootstrap的。

调用方法:

input控件写成

<input class="form-control dropdown-toggle" data-toggle="dropdown" id="dropdownMenu" type="text" value="" size="3"/>

在script里面调用

$(‘#dropdownMenu‘).endpoint();
时间: 2024-10-08 05:48:57

js控件,下拉菜单的相关文章

Atitit.ui控件---下拉菜单选择控件的实现select html

Atitit.ui控件---下拉菜单选择控件的实现select   html 1. 调用& model的实现 1 2. -----select.jsp------ 1 1. 调用& model的实现 Proj.vod2 <% List li=new ArrayList(); Map m=new HashMap (); m.put("lab","爱情"); m.put("v","1"); li.add(m)

js+CSS实现模拟华丽的select控件下拉菜单效果

<!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-

bootstrap-表单控件——下拉选择框select元素

1.运行效果如图所示 2.实现代码如下 <!DOCTYPE html> <html> <head>     <meta charset="utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <title>表单控件--下拉选择框select元</title>     <!-

android控件 下拉刷新pulltorefresh

外国人写的下拉刷新控件,我把他下载下来放在网盘,有时候访问不了github 支持各种控件下拉刷新 ListView.ViewPager.WevView.ExpandableListView.GridView.(Horizontal )ScrollView.Fragment上下左右拉动刷新,比下面johannilsson那个只支持ListView的强大的多.并且他实现的下拉刷新ListView在item不足一屏情况下也不会显示刷新提示,体验更好. 国内网盘地址:http://www.400gb.c

HTML+JS+CSS 实现下拉菜单

最近在看视频学习做一些HTML+JS+CSS的实例,第一个是实现下拉菜单. 5.7 制作的思路是:1.静态网页的制作 2.动态特效实现菜单的显示和隐藏(三种方法:css.JavaScript.jQuery) 3.浏览器的兼容问题(低版本IE可能不支持等) 在用css实现时,由于盒子模型有自己默认的margin和padding值,所以要reset. 有一点比较有疑问的实,老师在视频里说position:absolute要和left.top同时使用.这是为什么?在实现的时候,我并没有使用left和t

Bootstrap 学习之js插件(下拉菜单(Dropdown)插件)

Bootstrap 下拉菜单(Dropdown)插件 Bootstrap 下拉菜单 这一章讲解了下拉菜单,但是没有涉及到交互部分,本章将具体讲解下拉菜单的交互.使用下拉菜单(Dropdown)插件,您可以向任何组件(比如导航栏.标签页.胶囊式导航菜单.按钮等)添加下拉菜单. 用法 您可以切换下拉菜单(Dropdown)插件的隐藏内容: 通过 data 属性:向链接或按钮添加 data-toggle="dropdown" 来切换下拉菜单,如下所示: <div class="

JS 按钮下一步 下拉菜单内容转换

下一步按钮 用到的知识点 点击事件  onclick 移除属性  removeAttribute 创建属性  setAttribute 源代码 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <input id="aaa&qu

JS练习题 ( 下拉菜单;好友选中输入)

题一.左侧菜单下拉 做题思路:先做菜单和子菜单,把子菜单默认隐藏.再用JS调样式. <style type="text/css">*{ margin:0px auto; padding:0px}.text1{ width:180px; height:39px; border-bottom:1px solid white; text-align:center; line-height:40px; vertical-align:middle; color:white}.text

js之原生下拉菜单

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>js之下拉菜单</title> 6 <style type="text/css"> 7 *{margin:0;padding:0;} 8 ul{list-style:none;} 9 #nav{width:500px;height:30px;ba

一个css和js结合的下拉菜单,支持主流浏览器

首先声明: 本人虽然在web前端岗位干了好多年,但无奈岗位对技术要求不高.html,css用的比较多,JavaScript自己原创的很少,基本都是copy修改,所以自己真正动手写时,发现基础很不牢固,边学习边实践,收获很大. 效果图: 不废话了,贴码了 1.css代码 a:link{color:white;text-decoration:none;} a:visited{color:white;text-decorative:none;} a:hover{color:white;text-dec