精华内容
下载资源
问答
  • 代码如图,设置input的type属性值为...结果如下图:解决方法是在input标记里面添加name属性,并保持两个name属性的值相同,例如可以设置两个input标记中的name=“sex”,如图所示: 这时就可以实现二选一了: ...

    代码如图,当设置input的type属性值为radio时,会发现男女皆可选,不能实现只选一个,而且一旦选中就无法更改

    在这里插入图片描述
    结果如下图:在这里插入图片描述解决方法是在input标记里面添加name属性,并保持两个name属性的值相同,例如可以设置两个input标记中的name=“sex”,如图所示:

    在这里插入图片描述
    这时就可以实现二选一了:
    在这里插入图片描述

    展开全文
  • 1.使用p标记和input标记时,p标记和input 是分行的 2.使用label标记和input标记时,在label标记和input标记是 不分行的 使用效果为: 总结: 联用input 和label 标记 视觉上的效果更好。

    1.当使用p标记和input标记时,p标记和input 是分行的
    2.当使用label标记和input标记时,在label标记和input标记是 不分行的
    使用效果为:
    在这里插入图片描述
    总结:
    联用input 和label 标记 视觉上的效果更好。

    展开全文
  • 按上下键可以从结果中选择,本想在结果上点击回车键就选中此记录的,但在只有一个的情况下按下回车键居然会直接提交表单了,笔者水平有限,知其然而不知其所以然,只知道如果加多一个标记就不会提交表单,...

    原本笔者是想练习一下输入提示这个功能的,在写这个小例子的时候确发现了一个很奇怪的事,如下:


    我是想实现如下图的功能:

    在输入框输入字符,匹配显示包含输入字符的记录,按上下键可以从结果中选择,本想在结果上点击回车键就选中此记录的,但在只有一个<input>的情况下按下回车键居然会直接提交表单了,笔者水平有限,知其然而不知其所以然,只知道如果加多一个<input>标记就不会提交表单,这里希望得到高手们的详细解释。。。

    先上代码:

    <script language="javascript" type="text/javascript">
        //创建XMLHttpRequest对象
        function createXMLHttpRequest()
        {
            var obj;
            if (window.XMLHttpRequest)
            { //Mozilla 浏览器
                obj = new XMLHttpRequest();
            }
            else if (window.ActiveXObject)
            { // IE浏览器
                try {obj = new ActiveXObject("Msxml2.XMLHTTP");}
                catch (e)
                {
                    try { obj = new ActiveXObject("Microsoft.XMLHTTP"); }
                    catch (e) { }
                }
            }
            return obj;
        }
    
        //当输入框的内容变化时,调用该函数
        function searchSuggest(evn) {
            if (evn.keyCode == "40" || evn.keyCode == "38" || evn.keyCode == "13") {
                keyDown(evn.keyCode);
            }
            else {
                var inputField = document.getElementById("txtSearch");
                var suggestText = document.getElementById("search_suggest");
                if (inputField.value.length > 0) {
                    var o = createXMLHttpRequest();
                    var url = "Server.aspx?searchText=" + escape(inputField.value);
                    o.open("GET", url, true);
                    o.onreadystatechange = function () {
                        if (o.readyState == 4) {
                            if (o.status == 200) {
                                var sourceText = o.responseText.split("\n");
                                if (sourceText.length > 1) {
                                    suggestText.style.display = "";
                                    suggestText.innerHTML = "";
                                    for (var i = 0; i < sourceText.length - 1; i++) {
                                        var s = '<div οnmοuseοver="javascript:suggestOver(this);"';
                                        s += ' οnmοuseοut="javascript:suggestOut(this);" ';
                                        s += ' οnclick="javascript:setSearch(this.innerHTML);" ';
                                        s += ' class="suggest_link">' + sourceText[i] + '</div>';
                                        suggestText.innerHTML += s;
                                    }
                                }
                                else { suggestText.style.display = "none"; }
                            }
                        }
                    }; //指定响应函数
                    o.send(null); // 发送请求
                }
                else { suggestText.style.display = "none"; }
            }
        }
    
        function suggestOver(div_value) { div_value.className = "suggest_link_over"; }
    
        function suggestOut(div_value) { div_value.className = "suggest_link"; }
    
        function setSearch(obj)
        {
            document.getElementById("txtSearch").value = obj;
            var div = document.getElementById("search_suggest");
            div.innerHTML = "";
            div.style.display = "none";
        }
    
        function tbblur()
        {
            var div = document.getElementById("search_suggest");
            //div.innerHTML = "";
            div.style.display = "none";
        }
    
        var index = -1; //表示当前选中的行索引
        function keyDown(the_key) {
            //判断提示DIV是否是现实状态
            if (document.getElementById("search_suggest").style.display != "none") {
                //获取里面所用行
                var my_div = document.getElementById("search_suggest").getElementsByTagName("div");
                var the_num = my_div.length;
                switch (the_key) {
                    case 40: //向下
                        //判断index是否已经到最下面
                        if (index == the_num - 1) {
                            index = 0;
                        } else {
                            index++;
                        }  
                        for (var i = 0; i < the_num; i++) { my_div[i].className = null; }//清楚所有选中
                        my_div[index].className = "suggest_link_over";
                        break;
                    case 38: //向上
                        //判断index是否已经到最上面
                        if (index == 0) {
                            index = the_num - 1;
                        } else { index--; }
                        for (var i = 0; i < the_num; i++) { my_div[i].className = null; } //清楚所有选中
                        my_div[index].className = "suggest_link_over";
                        break;
                    case 13: //回车
                        //将选中的内容放入文本框中
                        if (my_div[index].innerHTML != null) { document.getElementById("txtSearch").value = my_div[index].innerHTML; }
                        break;
                }
    
            }
        }
    
    </script>

    <body>
        <form id="form1" action="" οnsubmit="alert('提交了!')">
            <div style="text-align:center;" ><h2>(AJAX-JS)实现输入提示</h2></div>
            <div style="text-align:center;" >
            <input type="text" id="txtSearch" name="txtSearch" autocomplete="off" οnkeyup="searchSuggest(event);"
                    size="20" class="input_out"
                    οnfοcus="this.className='input_on';this.οnmοuseοut=''"
                    οnblur="this.className='input_off';this.οnmοuseοut=function(){this.className='input_out'};"
                    οnmοusemοve="this.className='input_move'"
                    οnmοuseοut="this.className='input_out'" style="width: 200px" /><br />
                    <div style="width:205px;text-align:center;margin-right:auto;margin-left:auto; display: none;" id="search_suggest" ></div>
            </div>
        </form>
    </body>


    1.只有一个<input>的情况下,上下选择结果后按回车键(表单提交了),结果如下图:

    按回车后就所有清空了:


    2.但是,如果我加多了一个<input>标记之后,选中记录后按回车键就不会提交表单:

    <body>
        <form id="form1" action="" οnsubmit="alert('提交了!')">
            <div style="text-align:center;" ><h2>(AJAX-JS)实现输入提示</h2></div>
            <div style="text-align:center;" >
            <input type="text" id="txtSearch" name="txtSearch" autocomplete="off" οnkeyup="searchSuggest(event);"
                    size="20" class="input_out"
                    οnfοcus="this.className='input_on';this.οnmοuseοut=''"
                    οnblur="this.className='input_off';this.οnmοuseοut=function(){this.className='input_out'};"
                    οnmοusemοve="this.className='input_move'"
                    οnmοuseοut="this.className='input_out'" style="width: 200px" /><br />
                    <div style="width:205px;text-align:center;margin-right:auto;margin-left:auto; display: none;" id="search_suggest" ></div>
            </div>
            <!--注意:当只有一个input的时候按回车键会提交,故需要加多一个input控件!-->
            <input style="display:none;" id="Text1" type="text" />
        </form>
    </body>


    结果图:


    综述:在表单内,如果只有一个<input>标记的时候按下回车键,此<input>标记会变为submit类型提交表单,但如果有2个或以上<input>标记则不会提交表单,希望得到详细的解释!

    展开全文
  • 在项目开发中我们经常会遇到需要更改input单选和多选样式的情况,今天就给大家介绍一种简单改变input单选和...相信这并不难以理解,接下来我们先理解思路:(1)首先在html用label为 input 元素定义标记,也就是你点...

    在项目开发中我们经常会遇到需要更改input单选和多选样式的情况,今天就给大家介绍一种简单改变input单选和多选样式的办法。

    在这之前先简单介绍一下:before伪类

    :before 选择器向选定的元素前插入内容。使用content 属性来指定要插入的内容(content是必须的哦)。

    相信这并不难以理解,接下来我们先理解思路:

    (1)首先在html用label为 input 元素定义标记,也就是当你点击label标签时相应的input也会选中或取消

    (2)接下来就是写css了,将input隐藏,只需要在label之前加入你的样式就好了,可以是图片也可以是自己画的圆圈,下面的这个例子是我写的圆,当然也可以替换成背景图。input[type="radio"]+label:before是未选中状态的样式input[type="radio"]:checked+label:before是选中状态的样式

    中国

    {:;

    }{:;

    }{:;:;:;:;:;:;:;:;:;

    }{:;:;:;:;:;:;:;:;:;

    }

    把radio替换成checkbox就是多选的啦。

    注:隐藏和伪类定位是关键

    展开全文
  • include和param动作标记的应用 题目描述: 编写JSP页面input.jsp、first.isp 和second.jsp,将3个JSP文件保存...first.jsp被加载时获取input.jsp页面中include动作标记的param子标记提供的表格的行数和列数,second
  • 本文实例讲述了JS简单获取...id:用来设置需要获取HTML标记的id值。 二 应用 获取文本框并修改其内容 在页面加载后的文本框中将会显示“初始文本内容”,单击按钮后将会改变文本框中的内容。 三 代码 <html xmlns
  • label定义和用法:label 标签为 input 元素定义标注(标记)。label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,用户选择该标签...
  • 我有一个函数,我在我的经理中derclare bean,我想在inputText中返回值,但是我将函数的名称放在inputText标记的value属性中时,如下所示:出现此错误:Etat HTTP 500 - /pages/test.xhtml @13,106 value="#{...
  • 某些浏览器 在运行 button ... 1、在IE浏览器下面时,button标签按钮,input标签type属性为button的按钮是一样的功能,不会对表单进行任何操作。   2、但是在W3C浏览器,如Firefox下就需要注意了,button标签按
  •  标签为 input 元素定义标注(标记)。  label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,用户选择该标签时,浏览器就会自动...
  • 1、隐式关联,使用label标记的for属性为input的id号 <label for="username">...2、显式关联,直接把input标记放在label标记中。 <label>用户名:<input id="username" name="username" type="text
  • 白帽波哥的上一篇文章《这三种域名...所谓301跳转,说的简单点,其实就是在网站上做一个标记,告诉前来访问的客人:“我们搬家啦,搬到的新地址是xxxxxx.com,你就去那找我吧”,这样用户打开网站时,虽然进去之前...
  • lable标记元素

    2016-07-26 18:35:31
    lable标记元素与表单元素配合,效果是点击lable中的文本时,表单控件会获得焦点。 配合的方式有2种: 显式:使用for指向联系的表单元素的name属性值。 label for="user-name">...
  • input type="button" value="Login" class="btn" action="url" level="cms_user_login" form="login" /></td> <td></td> </tr> </table> </code></pre> <p>it assumes that the...
  • 单选框如上,不勾选样式是:class="custom-radio" 勾选后样式是:class="custom-radio cr-check"   ... 保证购买金额在100万以上 ...则可以对样式进行判断,存在样式cr-check说明已勾选,设置input标签l
  • 标签标记的文本上即可, 相当于给form 表单的input 元素添加了一个感应区。 废话少说, 举例如下: 例子1: 点击" 用户名:" 就可以定位光标到输入框 &lt;form&gt; &lt;label f...
  • css零散知识点标记

    2019-06-12 10:11:00
    使用input输入框的时候,默认情况下在后面会出现删除按钮,这个时候需要代码去去除,去除ie下的删除按钮代码如下: ::-ms-clear{display: none;} ::-ms-reveal{display: none;} 去除edge下的删除按钮...
  • <label> 标签为 input 元素定义标注(标记)。label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,用户选择该标签时,浏览器就会...
  • 我在我的网站中使用了bootstrap input-tags。...我有什么,现在是:如何从bootstrap input-tags获取值然后插入mysql数据库Tags我与我的加标签完成,它生成的标签,"sport"::after"poltics"::a...
  • 标签为 input 元素定义标注(标记)。 label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,用户选择该标签时,浏览器就会自动将...
  • 什么是Vue指令Vue指令是一种附加到DOM元素上的特性,通常以"v-"作为前缀来告诉Vue这是一种特殊的标记渲染到该DOM时就会执行指令特性,以实现对HTML元素的一些行为控制。Vue内置了很多指令,下面列出一些常用的...
  • 通过 $.fn.searchbox.defaults 重写默认的 defaults。搜索框(searchbox)提示用户输入搜索值。... 依赖 menubutton用法创建搜索框(Searchbox)1、从标记创建。把 'easyui-searchbox' class 加入到 ...
  • 定义与用法 标签为 input 元素定义标记(名称);label 元素不会呈现任何特殊效果。但点击label 元素内文本时,会触发此控件,浏览器自动将焦点转到和标签相关的表单控件上。提示:“for” 属性可把 label 绑定到...
  • 1、input 文件选择框 常用属性:name 2、label 标签元素,用于显示文本,可以将该元素与其他控件元素进行绑定,我们点击label时,等于点击了被绑定的控件,通过for属性进行绑定,属性值为被绑定控件的id值 3、...
  • 2. 询问在x坐标为a时,与最低的线段的高度,给出此时y的坐标。Input第一行一个整数m,表示事件数。 接下来m行,每行有若干正整数,第一个数D表示事件类型。 若D=1,表示添加一条线段,四个整数x1,y1,x2,y2。 若...
  • Color the ball Problem Description ...Input 每个测试实例第一行为一个整数N,(N N = 0,输入结束。   Output 每个测试实例输出一行,包括N个整数,第I个数代表第I个气球总共被涂色的次数。  
  • 编写3个JSP页面:input.jsp、first.jsp和second.jsp,将3个JSP文件...first.jsp被加载时获取input.jsp页面中include动作标记的param子标记提供的表格的行数和列数,second.jsp被加载时获取input.jsp页面中include
  • vue中遇到的问题

    2016-06-18 18:37:00
    1 input中的number标记 number标记接收N个0时,会转换为一个0,此时如果是数字验证码会出现问题,建议数字验证码不要使用number标记 2 cros跨域请求,后台拦截器拦截 在项目中后台有时候会设置请求拦截器,加载...

空空如也

空空如也

1 2 3 4 5 ... 16
收藏数 305
精华内容 122
关键字:

当input标记的