input文本框的value属性在页面中不随输入的数据而变化

时间:2022-08-05 01:53:05

今天,在做试验遇到这么一个需求:

  一个input文本框,输入值后将标签传到后台,在后台解析标签,发现value仍然是初值,不是我们改变后的值。

  

例如:

<input name="" type="text" value="SS">

当为们改变文本框的值的时候,其value属性值仍然是SS

input文本框的value属性在页面中不随输入的数据而变化

 解决办法:在失去焦点的时候删除此input标签,再创建一个一模一样的标签,value属性设置为改过之后的值。

<input name="ww" type="text" onblur='updateInputValue()'>
    function updateInputValue() {
var $inputParent = $("[name='ww']").parent()//获取此元素的父亲
var $span = $inputParent.children("span");//获取到此元素的哥哥
var value = $("[name='ww']").val();//获取此元素修改后的值
$("[name='ww']").remove();//删除此元素
$span.after($("<input type='text' value='"+value+"' onblur='updateInputValue()' name='ww'/>"));//利用修改后的值重新拼接一个input
}

效果:

input文本框的value属性在页面中不随输入的数据而变化

第二种方式:(多谢评论区的一位兄弟)

$(obj).attr("value",$(obj).val());实现,亲测有效
    <body>
<input type="text" name="xxx" id="xxx" value="" onchange="changeValue(this)" />
</body>
<script>
function changeValue(obj){
$(obj).attr("value",$(obj).val());
}
</script>