1、css样式代码

<style type="text/css" >
.icon-search {background: url(./css/images/删除.png) no-repeat;width: 15px;height: 15px;position: absolute;display: block;/*top: 10px;right: 5px;*/cursor: pointer}
</style>

2、html代码

<div id="box"><input id="target" type="text" /><i class="icon-search"></i>
</div>

3、jQuery代码

 $(function () {//要删除的targetvar elem = $("#target");var X, Y;X = elem.offset().left + elem[0].offsetWidth - (15 + 5);//距离浏览器左边距离Y = elem.offset().top + ((elem[0].offsetHeight) / 2) - 15 / 2;//距离浏览器上边距离$(".icon-search").css({ left: X, top: Y });});

4、效果图片

5、素材文件

转载于:https://www.cnblogs.com/study10000/p/10419665.html

文本框里面加删除按钮相关推荐

  1. 添加删除按钮html代码怎么写,JavaScript添加一个文本框并带有删除按钮

    JavaScript添加一个文本框并带有删除按钮属于前端实例代码,有关更多实例代码大家可以查看. 实际操作中可能需要动态的创建和删除一个元素,比较常见是添加一个文本框和一个删除按钮,点击删除按钮可以删 ...

  2. android文本框左右加减按钮长按一直加减

    为什么80%的码农都做不了架构师?>>>    来说说今天的战绩吧,说是战绩,是因为今天写代码时效率挺高,可能是因为集中精力吧,所以,如果要写好程序的话,最好满足以下两点:  1.写 ...

  3. html文本框后面加一个按钮怎么对齐,怎样对齐文本框和图像(image)按钮实现三点一线...

    一个文本框旁边一个按钮是很经常用到的网页内容,比如搜索框等等,而如果旁边的按钮使用图像的话,他们竖直方向就很不容易对齐,即使使用 vertical-align.padding和margin等都不行(特 ...

  4. php怎么把文本框的边框去掉,如何在文本框中设置清除按钮

    有时我们会看到在文本框中的右边会有一个圆圈里面有个×,这其实就是清除按钮,那么如何在文本框中来实现这个清除按钮呢?接下来的这篇文章就来给大家介绍关于在文本框中设置清除按钮的方法. 我们先来看一下设置清 ...

  5. 按clear按钮清空两个文本框的内容,按copy按钮时将Source文本框的内容复制到Target文本框,按close按钮结束程序的运行

    按clear按钮清空两个文本框的内容,按copy按钮时将Source文本框的内容复制到Target文本框,按close按钮结束程序的运行 ` package p1; import java.awt.* ...

  6. java如何创建一个文本框_创建一个有文本框和三个按钮的程序。当按下某个按钮时,使不同的文字(Java..._考试资料网...

    问答题创建一个有文本框和三个按钮的程序.当按下某个按钮时,使不同的文字("Java","编程","不难学")显示在文本框中.已经给出部分代码 ...

  7. html文本框连接数据库失败,从按钮点击将数据从MySQL数据库加载到HTML文本框

    我使用PHP加载服务ID s到下拉框.当用户点击按钮时,应该在下面的文本框中显示与该ID相关的其他详细信息. 这是我到目前为止的代码. //Database initialization requir ...

  8. web界面文本框内部加按钮

    浏览网页时,界面经常可以见到这样的搜索框设计: 看着就像一个文本框内嵌套了一个按钮,想着是不是有哪个方式能够直接实现这种组件的方式,但是找了找在实际的web里边并没有标办法直接实现这种界面样式.找了很 ...

  9. java中文本框显示在命令按钮后面_Maya中Pymel写个带界面的重命名工具(一)

    创建窗口 pymel.core.windows.window() 此命令用来创建一个窗口,但不会显示窗口 显示窗口 pymel.core.windows.showWindow() 此命令用来显示指定窗 ...

  10. html 文本框数量加减,收藏!js实现input加减

    好的程序员是会复制粘贴的,这样说好像会被唾弃的..... html 减号按钮点击事件 function subtraction(){ //获取-号按钮 var subtraction = docume ...

最新文章

  1. 安装高可用性虚拟机,livemigration系列之九
  2. boost::geometry模块实现递归多边形线性区域的测试程序
  3. string.Format 格式化
  4. android xml 设置图片,android 的几种图片效果xml写法
  5. php 漂亮的分页类
  6. 1094:零起点学算法01——第一个程序Hello World!
  7. Python机器学习:逻辑回归007scikit-learn中的逻辑回归
  8. 激活函数active function
  9. js高级编号笔记[新]-事件
  10. PyTorch绘制训练过程的accuracy和loss曲线
  11. 分治法——查找最大最小元素(C++)
  12. 网络安全信息收集的思路
  13. 几个学习Python的网站推荐
  14. 资源网站模板Emlog程序zytheme模板
  15. 华为云王红新_华为云新加坡峰会盛大举行,多家公司签署MoU
  16. 国赛mysql加固_2019 全国大学生信息安全竞赛创新能力实践赛3道Web Writeup
  17. 网上看到的一个好文章,自勉
  18. rpa项目poc_[经典收藏]终极RPA术语表:机器人流程自动化的基础概念
  19. Android Studio 下安卓 jni 开发错误 undefined reference to AndroidBitmap_getInfo
  20. 第五集 插肩而过茶卡湖,朝发夕至格尔木

热门文章

  1. cocos2dx3.0关于实现椭圆运动
  2. Android使用蓝牙录音和播放
  3. Oracle项目管理系统之合同基本信息
  4. 嵌入式 Linux 启动时间优化
  5. Dreamweaver视频教程(共53课时)
  6. 为啥淘宝网,拍拍网上的windows7激…
  7. Java小程序之你画我猜
  8. Keil C51 的printf
  9. 可重用性,可维护性,可读性,可测试性,可用性,健壮性
  10. 计算机二级 MSOffice 考试历年真题精选