0

コントロールに問題があり、表のセルが増え続けています。

ここにアプリケーションがあります:アプリケーション

アプリを開き、以下の基本的な手順に従ってください。

  1. アプリを開いたときに、[質問を追加] ボタンをクリックして表の行を追加します。

  2. 追加した行で、[Open Grid] をクリックしてボタン [3] を選択し、再度グリッドを開いてボタン [4] を選択します。ボタン「3」と「4」を交互に選択し続けると、コントロールがわずかに下に移動し続けることがわかるはずです。つまり、オプションが選択されるたびにテーブルがわずかに増加します。

今奇妙なのは、同じコードを含むjsfiddleを持っているが、フィドルにこの問題がないことです.fiddleは、アプリを実行したい正確な方法です: http://jsfiddle.net /XM8hG/7/

ユーザーがオプションを選択するたびに、テキストエリアをテーブルセルの全高のままにしたいので、以下のコードがこの問題を引き起こしていると思います：

Jクエリ:

     $('.gridBtns').on('click', function()

    {

...

setWidth();

)};

function setWidth() {
    var questionCellWidth = $("#qandatbl_onthefly tbody .question").width();
    var questionCellHeight = $("#qandatbl_onthefly tbody .question").height();
    $(".textAreaQuestion").css({
        "width": (questionCellWidth - 6) + "px",
        "height": (questionCellHeight) + "px"
    });
}

テキストエリアをテーブル セルの高さいっぱいに保つために上記のコードが必要ですが、オプションが選択されるたびにテーブルが増加するのを止めるには、何を含めたり変更したりする必要がありますか?

setWidth()実際、オプションをクリックするのではなく、すべてのセルのすべてのテキストエリアが、それらが含まれている各テーブルセルの高さを埋めるように配置できる場所はありますか? テーブルが拡張されたことを認識するようなもので、テーブルセルが増加したことに気付いたときに、テキストエリアの高さを拡張してテーブルセルを独自に埋めます

4

1 に答える 1

1

textareaの高さをその親セルの高さに設定します。これは、大きくない場合でも少なくとも同じサイズになります。

私のブラウザでは、textareaのすべての側に2pxのパディングがあるため、textareaとそのパディングに対応するために、親セルは少なくとも4px大きくなっています。したがって、呼び出すたびsetWidth()に、少なくともその量だけ増加します。

textareaが常にセルを埋めるようにする場合は、テーブルセルのサイズを設定し、textareaをそのままにしておく必要があります100%。セルを埋めるようにwidthプロパティとheightプロパティを設定します。

編集：

したがって、CSSでは：

.textAreaQuestion { ... width: 100%; height: 100%; ... }

そして、setWidthの呼び出しをイベントハンドラーから削除します$('.gridBtns').on('click')。

于 2012-12-31T04:11:33.413 に答える