js动态新增组合Input标签

 var x = 1;
        function addlink() {

            var linkdiv = document.getElementById("add1_0");
            if (linkdiv.attributes.currentindex.value) {
                var tmp = linkdiv.attributes.currentindex.value;
                x = parseInt(tmp) + 1;
            }
            linkdiv.setAttribute(‘currentindex‘, x);
            var proid = ‘proid‘+ x ;
            var price = ‘price‘+ x ;

            $(‘#proid‘ + (x - 1)).after(‘+<input type="text" style="width: 50px;" id=\"‘ + proid + ‘\" />‘);
            $(‘#price‘ + (x - 1)).after(‘+<input type="text" style="width: 50px;" id=\"‘ + price + ‘\" />‘);
        }

一个简单的演示

  <p>商品ID:<input type="text" style="width: 50px;" id="proid0" />=<input type="text" id="Mixprice" style="width: 50px;" />
                                            <input type="button" value="增加" onclick="addlink();" /></p>
                                            <p>价   格:<input type="text" style="width: 50px;" id="price0" /></p>

效果图

时间: 2024-09-30 03:51:03

js动态新增组合Input标签的相关文章

js动态添加和删除标签

html代码 <h1>动态添加和删除标签</h1> <div id="addTagTest"> <table> <thead><tr><th>姓名</th><th>年薪</th><th>操作</th></tr></thead> <tbody id="info"> </tbody>

用js动态的改变img标签里面的src属性实现图片的循环切换

JS:根据循环切换的条件可以用 document.getElementById('').src=''设置, 或者jquery方法: $('#id').attr('src','图片名称’): 具体: if(true) { document.getElementById('id').src='a.png'; //or $('#id').attr('src','a.png'); }else { document.getElementById('id').src='b.png'; //or $('#id

非常漂亮js动态球型云标签特效代码

<%@ page contentType="text/html;charset=UTF-8" language="java" import="java.util.*" pageEncoding="UTF-8" %> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <base targe

html5中form表单新增属性以及改良的input标签元素的种类

在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动. <!DOCTYPE html><html> <head> <title>表单测试</title> <meta charset="utf-8" /> <!-- 在不支持h5的浏览器中,可以用CSS样式进行改写 --> &

使用CSS3中的input标签与lable标签组合实现banner图的切换

在做网页时,我们经常可以碰到banner图的切换.对于那些JS薄弱的同学来说,这就很尴尬了.今天,我来告诉大家如何使用CSS做出banner图切换的效果. 这里,用到了lable标签与input的组合,首先先来了解下lable标签 <label> 标签为 input 元素定义标签(label). label 元素不会向用户呈现任何特殊的样式.不过,它为鼠标用户改善了可用性,因为如果用户点击 label 元素内的文本,则会切换到控件本身. <label> 标签的 for 属性应该等于

JS动态生成Input文本框 并获取文本框值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns= "http://www.w3.org/1999/xhtml" > <head> <meta http-equiv= "Conte

【整合】input标签JS改变Value事件处理方法

某人需要在时间控件给文本框赋值时,触发事件函数.实现的效果: 1.文本框支持手工输入,通过用户输入修改值,手工输入结束后触发事件.阻塞在于失去焦点后才触发(输入过程中不触发事件) 2.通过JS方法修改值,修改后触发事件.重点阻塞在于此(JS赋值要触发) 最终采用方案: 1.IE(IE8及以下)下使用onpropertychange实现JS赋值后触发事件 2.需求是手工输入结束后才触发事件,避免在文本框实时输入文字的时候也因为onpropertychange触发事件,在trriger之前判断当前焦

jQuery计算文本宽度和input标签根据输入字符动态自适应宽度的实现

jQuery计算文本宽度的原理是利用html提供的<pre>标签,向dom中动态添加<pre>标签,标签里的内容就是要测试长度的文本,获取完长度之后再删除刚才添加的<pre>标签,从而可取到文本的大概长度了.为什么要用标签而不用其他标签呢,那来看看<pre>标签的特性吧:pre 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符;而文本也会呈现为等宽字体. <pre>标签的一个常见应用就是用来表示计算机的源代码.需要注

通过JS动态的修改HTML元素的样式和增添标签元素等

一. 通过JS动态的修改HTML元素的样式 1. 要想在js中动态的修改HTML元素的样式,首先需要写document, document我们称之为文档对象,这个对象中保存了当前网页中所有的HTML标签 代码写法如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>51-自定义原型对象</title>