效果:

样式效果引入bootstrap4.0就OK了。

HTML代码:

<div class="input-group w-25">
<div class="input-group-prepend">
<div class="input-group-text">¥</div>
</div>
<input type="text" class="form-control val" value="123">
</div>

JQ代码:

$(function(){
$(".val").click(function() {
if ($(this).hasClass("cur")) {
}else{
var v = $(this).val();
$(this).val("").val(v);
$(this).addClass("cur");
}
});
$(".val").blur(function() {
$(this).removeClass("cur");
});
});

input文本框点击第一次光标在最右边的更多相关文章

  1. 实现表单input文本框不可编辑的三种方法

    感谢原文作者:青灯夜游 原文链接:https://www.php.cn/div-tutorial-413133.html 目录 问题 实现方式 1.οnfοcus=this.blur() 2.read ...

  2. input文本框设置和移除默认值

    input文本框设置和移除默认值 这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: ...

  3. HTML input文本框设置和移除默认值

    这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: <input id=&quo ...

  4. input 文本框和 img 验证码对齐问题

    input 文本框和 img 验证码对齐问题 在网页制作中,常将 input 和 img 放在同一行,img标签总是比input高出一个头,非常难看. CCS实现input和img水平对齐的方法 同时 ...

  5. 我的插件のinput文本框实现宽度自适应

    先来最后结果:DEMO 介绍一下如何让一个文本框的宽度能够随着文本框中的内容的宽度增长而增长,也就是能够实现宽度自适应效果. 代码实例如下: <!DOCTYPE html> <htm ...

  6. 捕获input 文本框内容改变的事件(onchange,onblur,onPropertyChange比较)

    input 文本框内容改变,可以使用onchange或者onblur来判断,但onchange是在文本内容改变,然后失去焦点的时发生,onblur是在失去焦点时发生,不会自己去判断. 如: <i ...

  7. chrome下input文本框自动填充背景问题解决

    chrome下input文本框会自动填充背景,只需要给文本框加一个样式即可解决问题 input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px ...

  8. js中input文本框设置和移除默认值

    这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: <input id=&quo ...

  9. input文本框禁止修改文本——disabled和readonly属性的作用及区别

    1.input文本框禁止修改文本 disabled属性:<input type="text" name="name" value="xxx&qu ...

随机推荐

  1. SDUT OJ 数据结构实验之二叉树七:叶子问题

    数据结构实验之二叉树七:叶子问题 Time Limit: 1000 ms Memory Limit: 65536 KiB Submit Statistic Discuss Problem Descri ...

  2. CSS媒体查询及其使用

    1.什么是媒体查询 媒体查询可以让我们根据设备显示器的特性(如视口宽度.屏幕比例.设备方向:横向或纵向)为其设定CSS样式,媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成.媒体查询中可用于 ...

  3. pg存储过程和sql语句块

    展E宝项目使用的是postgresql数据库,批量发送红包需求,需要采用存储过程来初始化红包记录数据. 创建存储过程语句有固定的架子,如下 CREATE OR REPLACE FUNCTION pub ...

  4. android点击桌面App图标activity启动流程

    1.点击桌面App图标,Launcher进程采用Binder IPC向system_server进程发起startActivity请求:2.system_server进程接收到请求后,向zygote进 ...

  5. oracle 日志文件

    --Oracel Grid 11.2的Agent有多个,其中有两个最重要:orarootagent.oraagent --它们有各自的日志文件,这些Agent的日志文件位于: $grid_home/l ...

  6. nginx 代理服务指令详解

    nginx 正向代理与反向代理说明图 超级形象说明. 正向代理指令: 1, resolver 这个用于DNS服务器的ip . DNS服务器的主要工作是进行域名解析,将域名映射为对应IP地址 resol ...

  7. mysql 问题总结[转]

    一.Can't connect to MySQL server on 'localhost' (10061)   不能连接到 localhost 上的mysql分析:这说明“localhost”计算机 ...

  8. DB Intro - MongoDB Basic

    mongoDB basic from:http://www.tutorialspoint.com/mongodb prject:https://github.com/chenxing12/l4mong ...

  9. Eclipse快捷键--备忘

    [Ct rl+T] 搜索当前接口的实现类 1. [ALT +/]    此快捷键为用户编辑的好帮手,能为用户提供内容的辅助,不要为记不全方法和属性名称犯愁,当记不全类.方法和属性的名字时,多体验一下[ ...

  10. Ubuntu(Linux) 下 zip 命令使用详解

    1.功能作用:压缩文件或者目录 2.位置:/usr/bin/zip 3.格式用法:zip [-options] [-b path] [-t mmddyyyy] [-n suffixes] [zipfi ...