效果:

样式效果引入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. opencv学习笔记2

    import cv2 as cvimport numpy as np"""#图像加法运算 即像素加法 (结果图=图1+图二) (两个图像必须是等大等类型的)image = ...

  2. tomcat添加管理后台的用户名和密码(为jenkins连接tomcat用)

    vim  ./conf/tomcat-users.xml <role rolename="admin"/> <role rolename="admin- ...

  3. C++_类入门5-智能指针模板类

    智能指针是行为类似于指针的类对象,但这种对象还有其他功能. 本节介绍三个可帮助管理动态内存分配的智能指针模板(auto_ptr.unique_ptr和shared_ptr). void remodel ...

  4. C++_新特性1-类型转换运算符

    C++的创始人认为C语言的类型转换运算符太过于松散.他采取了更加严格的限制允许的类型转换.并添加了4个类型转换运算符. 这部分特性比较高阶,我把它归于奇技淫巧的范畴.这里简单介绍一下,以后实际有用到再 ...

  5. spring中的idref标签详解

    spring中的idref元素 idref元素是一个简单的对容器中存在的另外一个bean的检错途径(通过id); <idref bean="someBeanId"/> ...

  6. Luogu P1052 过河 DP

    复习复习DP...都忘了QAQ... 好了这道题我其实是看题解才会的... 方程 f[i]=min(f[i-j]+v[i]) v[i]表示i是不是石头 s<=j<=t 路径压缩引用一下证明 ...

  7. 查找表,Two Sum,15. 3Sum,18. 4Sum,16 3Sum Closest,149 Max points on line

    Two Sum: 解法一:排序后使用双索引对撞:O(nlogn)+O(n) = O(nlogn) , 但是返回的是排序前的指针. 解法二:查找表.将所有元素放入查找表, 之后对于每一个元素a,查找 t ...

  8. [转] Chrome - 浏览器跨域访问设置(附:新老版本两种设置方法)

    [From] http://www.hangge.com/blog/cache/detail_1703.html 在进行前后分离的 webapp 开发,或者 H5 移动 App 开发时,我们会使用 P ...

  9. Linux下Tomcat启动报 The BASEDIR environment variable is not defined

    今天是2017年2月27.在Linux下部署Tomcat官网下载的Tomcat 8.5,结果启动startup.sh报如下错,即使只是跑version.sh也报同样的错. $ ./version.sh ...

  10. Python Flask框架之页面跳转

    IDE用的PyCharm(还是vs强大啊). 项目结构: 2:页面: <!doctype html> <html lang="zh"> <head&g ...