1

必須フィールドとして2つのテキストボックスを重ねて表示します。下の要素を下にシフトせずに、テキストボックスの下に「フィールドが必要です」というメッセージを表示するにはどうすればよいですか？

ここに画像の説明を入力してください

「発信元が存在しません」というメッセージが表示されると、「宛先」テキストボックスが少し下に移動します。エラーメッセージを表示するときに[宛先]テキストボックスが移動しないようにするにはどうすればよいですか？私はこれをJavascriptで行いたいと思います。

ここに画像の説明を入力してください

これは私が試したことであり、これを行う方法がわかりません。validateStop（）メソッドは「div」要素を作成し、その中にエラーメッセージを挿入します。

function validateStop(stopNode){
        var inputStop = $.trim(stopNode.value);
        createSiblingNodeFor(stopNode);//creates div node to display error msg. 
        if(isEmpty(inputStop)){
            showInputRequiredMsg(stopNode.id, stopNode); 
            return false;
        }
}


<td>
    <input id="origin" type="text" onblur="validateStop(this)" value="" name="origin">
    <div id="originvalidationResult" style="color: red;">origin is required.</div>
</td>

編集：

div要素に「position：absolute」を追加しました。これは、Firefoxで機能しているように見えますが、IE8で発生したことです。IE8を使用する必要があります。

In IE8:

ここに画像の説明を入力してください

In Firefox:

ここに画像の説明を入力してください

4

1 に答える 1

0

物事を予想どおりに進める<td>には、ページがレンダリングされるときに親に十分な高さがあることを確認してください (高さスタイルを適用します)。また、入力フィールドの高さを指定し、エラー div の高さも指定します。何もずれなくなるまで間隔を微調整します。

于 2013-03-19T17:01:58.917 に答える