Question

我刚开始使用Javascript。我已经通过代码在

中实现了JS中的onchange事件

    <html>
    <head>
    <script>
    function fun()
    {
        var x=document.getElementById("price1");
        document.forms['forms1'].price.value=x.value*2;
    }
    </script>
    </head>
    <body>
    <form name="forms1">
    Enter Price: <input type="text" id="price1" onchange="fun()">   
    value is: <input name="price" type="text" >
    </form>
    </body>
    </html>

但问题是我得到像

这样的输出

值为：| _ _ |

但我希望它像没有input tag的段落（即不在一个方框中）。我想让它像文字一样被改变。例如value is: 20而非value is:|___20___|。有什么帮助吗？

Answer 1

一种方法是设置输入框的样式

<input name="price" type="text" class="text" disabled />

和

.text{
    border:0;
    background-color:transparent;
    color:black;
}

演示http://jsfiddle.net/gaby/ttpFa/

另一种方法是使用span来保存价格而不是input元素。

<form name="forms1">
    Enter Price: <input type="text" id="price1" onchange="fun()"/>   
    value is: <span id="price"></span>
</form>

和

function fun()
{
    var x=document.getElementById("price1");
    document.getElementById('price').innerHTML=x.value*2;
}

演示http://jsfiddle.net/gaby/ttpFa/1/

Answer 2

http://jsbin.com/utipob/1/

使用span：

值为：<span id="price"></span>

并将JS更改为：

    function fun()
    {
        var x=document.getElementById("price1").value;
        document.getElementById('price').innerHTML=x*2;    
    }

在Javascript中更改Onchange事件的内容

2 个答案: