文本框里的文字加下划线_html/css_WEB-ITnose-html教學-PHP中文網

首頁

web前端

html教學

文本框里的文字加下划线_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 pm 12:24 PM

文本框里的文字加下划线，
效果图：

每一个名称加下划线和分号，删除的时候是按每个名称删除，而不是一个字符一个字符地删。
如何实现，谢谢！！

回复讨论(解决方案)

我在???箱的收件人的文本框看到??的使用，而且???中文字?能?出?，用??示一些信息

应该就是这样吧！像我们在其他文件里边删除东西也是这样的啊！

如果你上面的是用户名的话你可以用很多种形式删除，比如把指定的名称; 替换为空字符一样可以实现。

本帖最后由 net_lover 于 2011-10-10 11:32:12 编辑

我在???箱的收件人的文本框看到??的使用，而且???中文字?能?出?，用??示一些信息
你研究它的代码没？

这个确实可以看看它的代码是怎么实现的

样式就能解决吧

CSS underline

比较困难

你这下划线用CSS不是能实现么。价格 underline就行了。
详见这里 http://www.docin.com/p-56329239.html

至于你说的删除的时候按照名称删除不是一个个字符删除，不知道你具体是什么意思。
不知道你具体的删除形式如何，什么样的情况给予删除。这个还是简单的，问题是要弄明白
什么情况删除什么。
underline 样式是把文本框里的的文字都加了下划线，我是把每个名称加下划线，
至于说删除，就是按照每个用户名删除，比如：张三，删除的时候是一次删除掉的，而不是两次删除的，不知道我说的明白吗

类似QQ发送邮件的收件人的文本框

其实这个我做过（好小的DEMO，没事干折腾的）。其实这个东西不是textbox
而是无数个DIV

http://blog.csdn.net/cj205/article/details/6277208

如果想加样式一点问题都没有

中间名称控制a的样式不就有下滑线了嘛。。。

删除当然是删除这个a咯。

用css实现。。。

文本框添加下划线不难，css添加样式即可：

<html><body><input type="text" id="t1" style="text-decoration: underline;"/></body></html>

但是要添加分号分隔的话，比较麻烦，outlook邮件里做法是在按回车后，在通信簿中检查用户名，要在web中实现的话，一样需要按下回车后触发事件，写一些js，通过ajax访问后台，匹配用户名，并操作文本框中的数据，实现这个需求。

学以致用

有些小麻烦

不是文本框，可以考虑用个div来模拟。里面有无数个小的span或者是div。

用样式文件定义，html基本功能

用span 给样式

嗯可以

简单的实现方法
更多功能自己可以添加

<script>function delSelect(v){evt = v||window.event;	if(evt.keyCode.toString()!="8" && evt.keyCode.toString()!="46"){if(window.event){window.event.returnValue=false;window.event.cancelBubble=true;return false;}else{evt.preventDefault();}return false;}ele = window.event?window.event.srcElement:v.target;while(ele.nodeType!=1) ele = ele.parentNode;while(ele.tagName!="DIV"){ele = ele.parentNode;}ele.parentNode.removeChild(ele)}</script><body><div style="border:1px solid gray;height:26px"><div style="float:left;text-outline:none" unselectable="on" contentEditable=true onkeydown="delSelect(event)"><span style="border-bottom:1px solid red">xxx;</span> </div><div style="float:left;text-outline:none" unselectable="on" contentEditable=true onkeydown="delSelect(event)"><span style="border-bottom:1px solid red">yyyy;</span></div> <div style="clear:both"></div></div>

谢谢大家的回复，
其实我就是想实现类似QQ或者163发送邮件时的收件人的文本框

呵呵呵呵

关注。

有高人做过么？
谢谢！！！！！！！！！！！

你要是想要某某网站的效果，建议你仔细研究下他们的源代码。你说的网站别人未必使用

firebug,yslow都是很好的查看代码的工具

12楼已经给你提供了例子

用一个隐藏的输入框，然后输入内容后在DIV里显示

拿分走人哈哈

飘过~~~~

试试是把一个超链存储到一个数组，进行读取，或者删除时候捕获键盘按下的是否为退格键可以删除数组的一个值，或为退格键的时候可判断最后一个“；”前的字符进行删除，大概是这样个，只是提供一个思路，具体还是靠自己

好像挺复杂, 应该是用div来模拟

看了,看了,有收获.

谢谢大家的回复！！！！！！！有了思路，希望能够解决。

好好好哈

用css实现

拿分吼吼

直接看源码

说实话有些蛋疼

试试是把一个超链存储到一个数组，进行读取，或者删除时候捕获键盘按下的是否为退格键可以删除数组的一个值，或为退格键的时候可判断最后一个“；”前的字符进行删除，大概是这样个，只是提供一个思路，具体还是靠自己
思路可以的

噢，原来如此啊！

陳述

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

HTML，CSS和JavaScript的未來：網絡開發趨勢Apr 19, 2025 am 12:02 AM

HTML的未來趨勢是語義化和Web組件，CSS的未來趨勢是CSS-in-JS和CSSHoudini，JavaScript的未來趨勢是WebAssembly和Serverless。 1.HTML的語義化提高可訪問性和SEO效果，Web組件提升開發效率但需注意瀏覽器兼容性。 2.CSS-in-JS增強樣式管理靈活性但可能增大文件體積，CSSHoudini允許直接操作CSS渲染。 3.WebAssembly優化瀏覽器應用性能但學習曲線陡，Serverless簡化開發但需優化冷啟動問題。

HTML：結構，CSS：樣式，JavaScript：行為Apr 18, 2025 am 12:09 AM

HTML、CSS和JavaScript在Web開發中的作用分別是：1.HTML定義網頁結構，2.CSS控製網頁樣式，3.JavaScript添加動態行為。它們共同構建了現代網站的框架、美觀和交互性。

HTML的未來：網絡設計的發展和趨勢Apr 17, 2025 am 12:12 AM

HTML的未來充滿了無限可能。 1)新功能和標準將包括更多的語義化標籤和WebComponents的普及。 2)網頁設計趨勢將繼續向響應式和無障礙設計發展。 3)性能優化將通過響應式圖片加載和延遲加載技術提升用戶體驗。

HTML與CSS vs. JavaScript：比較概述Apr 16, 2025 am 12:04 AM

HTML、CSS和JavaScript在網頁開發中的角色分別是：HTML負責內容結構，CSS負責樣式，JavaScript負責動態行為。 1.HTML通過標籤定義網頁結構和內容，確保語義化。 2.CSS通過選擇器和屬性控製網頁樣式，使其美觀易讀。 3.JavaScript通過腳本控製網頁行為，實現動態和交互功能。

HTML：是編程語言還是其他？Apr 15, 2025 am 12:13 AM

HTMLISNOTAPROGRAMMENGUAGE; ITISAMARKUMARKUPLAGUAGE.1）htmlStructures andFormatSwebContentusingtags.2）itworkswithcsssforstylingandjavascript for Interactivity，增強WebevebDevelopment。

HTML：建立網頁的結構Apr 14, 2025 am 12:14 AM

HTML是構建網頁結構的基石。 1.HTML定義內容結構和語義，使用、、等標籤。 2.提供語義化標記，如、、等，提升SEO效果。 3.通過標籤實現用戶交互，需注意表單驗證。 4.使用、等高級元素結合JavaScript實現動態效果。 5.常見錯誤包括標籤未閉合和屬性值未加引號，需使用驗證工具。 6.優化策略包括減少HTTP請求、壓縮HTML、使用語義化標籤等。

從文本到網站：HTML的力量Apr 13, 2025 am 12:07 AM

HTML是一種用於構建網頁的語言，通過標籤和屬性定義網頁結構和內容。 1）HTML通過標籤組織文檔結構，如、。 2）瀏覽器解析HTML構建DOM並渲染網頁。 3）HTML5的新特性如、、增強了多媒體功能。 4）常見錯誤包括標籤未閉合和屬性值未加引號。 5）優化建議包括使用語義化標籤和減少文件大小。

了解HTML，CSS和JavaScript：初學者指南Apr 12, 2025 am 12:02 AM

WebDevelovermentReliesonHtml，CSS和JavaScript：1）HTMLStructuresContent，2）CSSStyleSIT和3）JavaScriptAddSstractivity，形成thebasisofmodernWebemodernWebExexperiences。

See all articles