0

ドロップダウンボックスがあり、その中の各オプションには2つの値があります。選択に基づいてHTMLの値を動的に更新したい。表示する必要のある値は、ドロップダウンボックスの値から取得されます。これが私のコードですが、ここでは何も起こっていないようです。

<html>

    <head><title></title>

    <script type="text/javascript">

var a = new Array();
a[1] = "kgs"; 
a[2] = "gms"; 
a[3] = "ltrs"; 
a[4] = "ml"; 
a[5] = "nos"; 

window.onload = function() {

function updateunit(){

var b = document.getElementById("itemname");

var b1 = b.options[b.selectedIndex].value;

var c = b1.split(',');

var d = c[1];

var e = a[d];

alert(document.write(a[1]));

document.getElementById('pane2').innerHTML = b1 ;

}



updateunit()

document.getElementById('itemname').onchange = updateunit ;

}    

</script></head>


<body>

<form action='production.php' method="POST"> 

Item Name <select name ="itemname" id = "itemname">
<option value = '1,5' > A </option>
<option value = '2,5' > B </option>
<option value = '3,5' > C </option>
<option value = '4,5' > D </option>
</select> <br>



Amount <input type="text" name="amount"> <span id = "pane2"></span> <br>

</form>        

</body>

</html>
4

4 に答える 4

1

あなたがこれを達成しようとしていることを願っています。http://jsfiddle.net/nsjithin/SbtSF/

  1. 選択したドロップダウンの値を取得するには、elem.valueを実行する必要があります。
  2. updateunit関数をwindow.onload関数ではなく、グローバルとして配置します。
  3. 配列はインデックス0で始まります。したがって、分割するときにc [1]と言わない場合、常に5が得られ、c[0]から値を取得します。
于 2012-07-23T06:15:25.420 に答える
0 
Javascript is case sensitive

コード構文を確認してくださいselectedIndex-

とplzはこれを使用します-alert(a[1]);そしてそれが機能しているかどうかを私に知らせてください

    var a = new Array();
    a[1] = 'kgs'; 
    a[2] = 'gms'; 
    a[3] = 'ltrs'; 
    a[4] = 'ml'; 
    a[5] = 'nos'; 

    window.onload = function() {

    function updateunit(){

    var b = document.getElementById("itemname");

var b1 = b.options[b.selectedIndex].value;

新しい編集

これは、xampp-> htdocsの下にname.phpとして保存したコードであり、コードは次のようになり、ブラウザーで--localhost/name.phpとしてテストしました。

<?php
/*
I have a drop down box, each option in it has 2 values. I want to dynamically update value in my HTML based on the selection. The value that has to be shown is derived from drop down box values. Here is my code, but nothing seems to be happening here. 
*/
?>

    <html>

        <head><title></title>

        <script type="text/javascript">

    var a = new Array();
    a[1] = 'kgs'; 
    a[2] = 'gms'; 
    a[3] = 'ltrs'; 
    a[4] = 'ml'; 
    a[5] = 'nos'; 

    window.onload = function() {

    function updateunit(){

    var b = document.getElementById("itemname");

    var b1 = b.options[b.selectedIndex].value;

    var c = b1.split(',');

    var d = c[1];

    var e = a[d];

    alert(a[1]);

    document.getElementById('pane2').innerHTML = b1 ;

    }



    updateunit()

    document.getElementById('itemname').onchange = updateunit ;

    }    

    </script></head>


    <body>

    <form action='production.php' method="POST"> 

    Item Name <select name ="itemname" id = "itemname">
    <option value = '1,5' > A </option>
    <option value = '2,5' > B </option>
    <option value = '3,5' > C </option>
    <option value = '4,5' > D </option>
    </select> <br>



    Amount <input type="text" name="amount"> <span id = "pane2"></span> <br>

    </form>        

    </body>

    </html>
于 2012-07-23T06:07:34.643 に答える
0 
var a = ["kgs", "gms", "ltrs", "ml", "nos"];
window.onload = function() {
    updateunit();
    document.getElementById('itemname').onchange = updateunit;
}
function updateunit(evt) {
    var b1 = evt.target.value;
    if(b1) {
        var d = b1.split(',')[1];
        var e = a[d - 1];
        document.getElementById('pane2').innerHTML = e ;
    }  

}
于 2013-12-16T11:09:44.997 に答える
-2

それ以外の ：

document.getElementById('pane2').innerHTML = b1 ;

使用する ：

document.getElementById('pane2').html(b1);

参照： http ：//api.jquery.com/html/

于 2012-07-23T06:08:26.623 に答える