`
RepublicW
  • 浏览: 83270 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

在input前插入内容

 
阅读更多
方法一:


var objDiv = document.createElement('DIV'); 
var txt = document.getElementById("txt1");
txt.parentNode.insertBefore(objDiv,txt);



方法二:


function getAbsoluteTop(obj){
var top = obj.offsetTop;
while(obj != null && obj.offsetParent != null && obj.offsetParent.tagName != 'BODY'){
top += obj.offsetParent.offsetTop;
obj = obj.offsetParent;
}
return top;
}
function getAbsoluteLeft(obj){
var left = obj.offsetLeft;
while(obj != null && obj.offsetParent != null && obj.offsetParent.tagName != 'BODY'){
left += obj.offsetParent.offsetLeft;
obj = obj.offsetParent;
}
return left;
}
function getAbsoluteWidth(obj){
return obj.offsetWidth;
}
function getAbsoluteHeight(obj){
return obj.offsetHeight;
}
//objDoc是对于那个var objDoc = document.getElementById("txt1"); 
function divPosition(objDoc){
objDiv.style.left = getAbsoluteLeft(objDoc);
objDiv.style.top = getAbsoluteTop(objDoc)+getAbsoluteHeight(objDoc);
objDiv.style.width = getAbsoluteWidth(objDoc);
}
分享到:
评论

相关推荐

    javascript 在光标处插入指定内容

    在这种情况下,通常需要使用编辑器提供的API来插入内容,例如CKEditor的`insertHtml()`或`insertText()`方法。 此外,对于更复杂的场景,如处理多行文本、处理表格或嵌套元素时,可能需要更精细的逻辑来确保正确地...

    vue项目中在可编辑div光标位置插入内容的实现代码

    vue项目中在可编辑div光标位置插入内容 html: ($event, draggable='true' v-for=(item, key=index click=dropRelease($event,> {{item.labelName}} <div cont

    layui实现input框添加tag

    在前端开发中,Layui是一个非常流行的JavaScript框架,它提供了丰富的UI组件和便捷的API,使得开发者可以快速构建美观且功能完善的Web应用。本文将详细介绍如何使用Layui实现input框添加tag功能。 首先,我们需要...

    vue组件系列之TagsInput详解

    TagsInput 是一种可编辑的输入框,通过回车或者分号来分割每个标签,用回退键删除上一个标签。用 vue 来实现还是比较简单的。 先看效果图,下面会一步一步实现他。 注:以下代码需要vue-cli环境才能执行 (一)伪造...

    js点击连续添加input输入框并且判断值

    在JavaScript编程中,"js点击连续添加input输入框并且判断值"这个功能是常见的动态表单构建场景。这种技术常用于需要用户输入不确定数量信息的情况,例如购物网站的商品添加、在线问卷调查等。下面我们将详细讲解...

    在textarea光标处插入文本

    - 插入新文本,并更新`textarea`的内容。 - 如果`textarea`滚动条之前被激活,则保存滚动条的位置并恢复。 - 设置新的光标位置为插入文本后的位置。 #### 二、代码详解 下面是具体的JavaScript函数`insertAtCursor...

    Input XSS最新漏洞及利用

    Input XSS,全称为Input-Based Cross-Site Scripting,是一种常见的Web安全漏洞,允许攻击者通过在输入字段中注入恶意脚本来操纵用户浏览器的行为。这种漏洞通常发生在网站未能正确过滤或转义用户提供的数据,导致...

    点击添加input可删除.zip

    在网页设计和开发中,动态添加和删除输入框(input元素)是一项常见的需求,尤其是在创建表单或构建具有用户交互性的界面时。标题"点击添加input可删除.zip"描述了一个功能,即用户可以通过点击“添加”按钮来增加新...

    Textarea在光标停留处插入文字

    标题“Textarea在光标停留处插入文字”涉及到的是如何在`Textarea`中实现文字的动态插入,使得新添加的文字能精确地出现在用户当前光标所在的位置。这通常涉及到JavaScript的DOM操作和事件监听。 在HTML中,`...

    input 联想

    `input` 联想功能是增强用户体验的一种常见方式,它根据用户在输入框中键入的字符动态提供相关建议,常见于搜索框、地址栏和自动填充表单等场景。这种功能通过JavaScript实现,通常结合Ajax技术以异步方式从服务器...

    JavaScript获取,设置光标位置,兼容InputTextArea

    如果要在特定位置插入文本,可以先保存旧的光标位置,插入文本,然后更新光标位置: ```javascript let oldCursorPos = input.selectionStart; input.value = input.value.slice(0, oldCursorPos) + '新文本' + ...

    jq获取焦点插入内容

    本文将详细讲解如何使用jQuery获取焦点并插入内容,这在创建交互式表单或编辑器时非常实用。 首先,我们需要理解jQuery中的`focus()`方法。这个方法用于使元素获得焦点,通常用于文本输入框、密码框等可以输入的...

    通过javascript在光标处插入文本

    通过Javascript在光标处插入文本 在网页开发中,经常需要在文本框中插入文本,特别是在光标处插入文本。下面,我们将讨论如何使用Javascript在光标处插入文本。 光标位置获取 在获取光标位置之前,我们需要了解...

    Bootstrap3 input输入框插入glyphicon图标的方法

    bootstrap3如何在input输入框插入glyphicon图标呢?插入图标看起来比较醒目,满足用户体验价值观,此功能应用于各大网站。 怎么把图标放在输入框的开头?? 用户名 <span class=glyphicon></span> <input ...

    【JavaScript源代码】element input输入框自动获取焦点的实现.docx

    <el-input v-model="input" placeholder="请输入内容" ref="input"></el-input> ``` ```javascript this.$nextTick(() => { this.$refs.input.focus() }) ``` 这里使用`$nextTick`确保DOM更新后再执行聚焦...

    Data Input C#版

    - 在插入过程中可能出现错误,如数据类型不匹配或数据库约束冲突,因此应捕获并处理异常。 - 使用`OracleTransaction`进行事务管理,确保数据一致性。当发生错误时,可以回滚事务避免脏数据。 总结起来,“Data ...

    input 子系统

    每当一个新设备或handler初始化时,会遍历对方链表,寻找匹配项,一旦匹配成功,即调用`connect`函数创建`input_handler_instance`,并将其分别插入到device和handler的链表中。 4. **evdev结构体**:封装了`input_...

    insertAdjacentHTML动态插入行[归类].pdf

    document.all.paral.insertAdjacentHTML("afterBegin", "在文本前容器内插入内容</h1>"); document.all.paral.insertAdjacentHTML("beforeEnd", "在文本后容器内插入内容</h2>"); document.all.paral....

    Linux设备模型之input子系统详解.rar

    在用户空间,可以通过`/dev/input/*`设备节点访问Input子系统。`evtest`工具就是一个很好的例子,它可以用来测试和查看任何输入设备的事件流。此外,X Window系统和Wayland等图形服务器也通过Input子系统接收设备...

    如何在指定的地方插入html内容和文本内容

    例如,如果一个`<div>`已经包含了文本,而我们想在其后追加内容,`innerHTML`将覆盖所有现有内容,而`insertAdjacentHTML('beforeEnd', '新内容')`则会在原有内容之后插入新内容,保持原始数据完整。 此外,`...

Global site tag (gtag.js) - Google Analytics