0

テキストボックスを使用して動的テーブルを作成しようとしていますが、書き込むたびにテキストボックスを大文字に変換したいと考えています。

これを行う方法に関するアイデアはありますか??

現在、これは私が動的テーブルをどのように行っているかです:

var n = 1;
function addRow(tableID,nroColumna) {
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    for(i=0;i<nroColumna;i++){

        var cell = row.insertCell(i);
        var element = document.createElement("input");
        element.type = "text";
        element.name = n+"0"+i;
        element.size = "12";
        element.id = n+"0"+i;

        //element.onkeyup = function(){alert()};
        cell.appendChild(element);
    }
    n++;
}

しようとしましたdocument.getElementById(element.id).value.toUpperCase()が、element.id の null 値でエラーが発生しました

どんな助けでも大歓迎です!

4

4 に答える 4

2

CSSJavaScript 以外のソリューションで問題ない場合は、これを入力に適用できます。

text-transform: uppercase;

それは最初からテキストを大文字にするでしょう...

于 2013-03-04T14:57:09.313 に答える
2

Darkajax のソリューションは機能します。特定の ID を持つテーブル内の入力をターゲットにすることができます

#tableid input
{
    text-transform: uppercase;
}
于 2013-03-04T15:04:16.903 に答える
1

onkeyup 関数を有効にしてコードをテストしました。

var n = 1;
function addRow(tableID,nroColumna) {
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    for(i=0;i<nroColumna;i++){

        var cell = row.insertCell(i);
        var element = document.createElement("input");
        element.type = "text";
        element.name = n+"0"+i;
        element.size = "12";
        element.id = n+"0"+i;

        element.onkeyup = function(){alert(element.id);};
        cell.appendChild(element);
    }
    n++;
}

そして、それはうまくいきました。ただし、関数への呼び出しごとに計算された最後の element.id を使用します...そのため、3 つのセルの 1 つの行を作成すると、セルに入力するたびに、入力したセルに関係なく「102」と警告されます。の。

これは、onkeyup 関数が動的であるためです。これは keyup アクションで呼び出されます - オブジェクトの作成時には設定されません。そのため、最初に渡したときの値ではなく、アクションの時点で存在するelement.id 値を使用します。それが理にかなっていることを願っています。

私は最近のプロジェクトでこの問題を抱えていました。1 つの解決策は、for ループの内部動作用に別の関数を作成することです。

var n = 1;

function createRow (n, i) {
    var element = document.createElement("input");
    element.type = "text";
    element.name = n+"0"+i;
    element.size = "12";
    element.id = n+"0"+i;

    element.onkeyup = function(){alert(element.id);};

    return element;
}
function addRow(tableID,nroColumna) {
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    for(i=0;i<nroColumna;i++){
        var cell = row.insertCell(i);
        element = createRow(n, i);
        cell.appendChild(element);
    }
    n++;
}

このコードは正しい element.id 値を警告します。

編集: onkeyup() 行を次のように変更できます。

element.onkeyup = function(){document.getElementById(element.id).value = document.getElementById(element.id).value.toUpperCase();};

そして、それはあなたが望むように動作するはずです。

于 2013-03-04T15:27:21.970 に答える
0

jQueryでは次のようになります

$('.yourClass').val($(this).val().toUpperCase());

また

$('#yourId').css({'text-transform' : 'uppercase'})
于 2013-03-04T15:09:00.570 に答える