0

テキストボックスに数値を入力し、スイッチ機能を介して別の div タグでメッセージをその日の名前として表示しようとしています。スイッチ関数に渡す変数は、テキストボックスから値を取得する必要があります。しかし、ボタンをクリックしても関数を出力できず、「未定義」というメッセージが表示されます。助けてください ：）。ありがとうございました

<input type = "text" id = "test" />
<br>
<div id="box3" style = "border:solid 2px blue; height:15px;width:100px;"></div>
<br>
<input type = "button" onClick = "myTest()" value = "Click me" />

<script type="text/javascript">
function myTest(){
var x;
var d =document.getElementById('test').value;
switch (d)
{
case 0:
x="Today it's Sunday";
break;
case 1:
x="Today it's Monday";
break;
case 2:
x="Today it's Tuesday";
break;
case 3:
x="Today it's Wednesday";
break;
case 4:
x="Today it's Thursday";
break;
case 5:
x="Today it's Friday";
break;
case 6:
x="Today it's Saturday";
break;
}
document.getElementById('box3').innerHTML=x;
}

</script>
4

6 に答える 6

1

最初に整数にキャストする必要があります。

var d = parseInt(document.getElementById('test').value);
于 2012-08-16T14:42:44.440 に答える
1

ケースはすべてintであり、domから来るものはすべて文字列になるので、それを修正する必要があります:

var d = +(document.getElementById('test').value);//+ converts to number

文字列が のようになったときにas+someStringが返されますが、そこに文字が含まれていないことを確認してください。数字の後に文字が続くものを処理できますが、先頭にスペースと先頭にゼロがある文字列にはあまり適していません (入力を 8 進数として解釈します) 。NaN123fdsfparseIntparseFloat

または、ケースを引用して、デフォルトのケースを提供します。

case '6': x = 'Today is Saturday'; break;
default: x = 'Don\'t know what '+d+' is';

スイッチに渡した値を確認できます

@KooiInc への対応Let's simplify: 最適化して、確かに複雑にしましょう (ただし、パフォーマンスは向上します):

クロージャー: (最初にここで dom をロードする必要があります)

var test = (function(dayArray)
{
    var out = document.getElementById('box3');//only search dom once
    var in = document.getElementById('test');
    return function()
    {
        var day = dayArray[in.value] || 'Don\'t know day ' + in.value;
        out.innerHTML = 'Today is ' + day;
    }
})('Sunday,Monday,Tuesday,Wednessday,Thursday,Friday,Saturday'.split(','));

関数のプロパティ:

function test()
{
    if (!test.inElem)
    {
        test.inElem = document.getElementById('test');//search dom on first call
    }
    if (!test.outElem)
    {
        test.outElem = document.getElementById('box3');
    }
    if (!(test.days instanceof Array))
    {
        test.days = 'Sunday,Monday,Tuesday,Wednessday,Thursday,Friday,Saturday'.split(',');//create array once
    }
    var day = dayArray[test.inElem] || 'Don\'t know day ' + test.inElem;
    test.outElem.innerHTML = 'Today is ' + day;
}

これらの例は単なる楽しみです。時期尚早の最適化がすべての悪の根源であることはわかっているので、この段階ではそれほど心配する必要はありません。関数はオブジェクトであるため、関数が返された後でもメモリに残るプロパティを設定でき、クロージャーもそれを実行できることを知っておいてください (さらに多くのこと)。

于 2012-08-16T14:48:07.357 に答える
0

入力から数値を取得するときはいつでも、それを数値タイプに解析する必要があります。

var d = parseInt(document.getElementById('test').value, 10);
于 2012-08-16T14:44:15.350 に答える
0

値をintではなく文字列として読み取っています。

switch ステートメントの値を int に変換するか、ケースを文字列に変更します。

たとえば、各ケースステートメント

case '1':

それ以外の

case 1:

また

switch ( d ) {

になる

switch ( Number ( d ) ) {
于 2012-08-16T14:43:22.740 に答える
0

簡単にしましょう：

function dayOfWeek(val){
 // create an array of weekdays
 var dow = 'Sunday,Monday,Tuesday,Wednessday,Thursday,Friday,Saturday'
            .split(',');
 // print a string in #box3
 document.getElementById('box3').innerHTML = 
     'Today it\'s '+dow[Number(val)] || 'can\'t determine';
}
dayOfWeek(document.getElementById('test').value);

jsfiddleを参照してください

于 2012-08-16T14:49:15.833 に答える
0

switch ステートメントの代わりに配列を使用することをお勧めします。また、入力を数値として解析する必要があります。

function myTest() {
    var days = [
        'Sunday',
        'Monday',
        'Tuesday',
        'Wednesday',
        'Thursday',
        'Friday',
        'Saturday'
    ];

    var d = parseInt(document.getElementById('test').value, 10);

    document.getElementById('box3').innerHTML = 'Today is ' + days[d];
}
于 2012-08-16T14:47:42.553 に答える