2012-12-31 16 views
0

我遇到了問題,導致表格單元格不斷增加。當我繼續選擇一個選項時,表的大小不斷增加

我這裏有一個應用程序:Application

請打開應用程序,並遵循以下基本步驟:

  1. 當您打開應用程序,點擊「添加問題」按鈕,添加一個錶行。

  2. 在附加的行中點擊「打開網格」並選擇按鈕「3」,然後再次打開網格並選擇按鈕「4」。通過選擇按鈕「3」和「4」保持交替,您應該能夠看到控件保持輕微向下移動,這意味着每次選擇一個選項時,表格都會略微增加。

現在有什麼奇怪的是,我也有同樣的代碼的jsfiddle,但它並沒有在搗鼓這個問題,臉上的小提琴是我希望我的應用程序正在運行的確切方式: http://jsfiddle.net/XM8hG/7/

現在下面我相信,因爲每次用戶選擇一個選項,導致此問題的代碼,我想textarea的保持全高在它的表格單元格:

的Jquery:

 $('.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" 
    }); 
} 

現在我需要上面的代碼textarea在表格單元格中保持全高,但是我需要包含或更改哪些內容以便能夠在每次選擇選項時停止表格增加?

實際上是否有一個地方可以放置setWidth(),以便每個單元格中的每個textarea都可以填充它們所在的每個表格單元格的格式,而不是通過單擊選項單擊它?類似於它可以識別表格已經擴展,因此它擴展了textarea的高度以填充表格單元格,當它實現表格單元格增加時

回答

1

您將textarea的高度設置爲其父級的高度細胞,如果不是更大,它將至少是相同的大小。

在我的瀏覽器中,textarea在所有面上都有2px的填充,所以父級單元至少大4px以容納textarea及其填充。因此,每當您撥打setWidth()時,它至少會增加該數量。

如果您希望textarea始終填充單元格,您應該設置表格單元格的大小並保留textarea - 將其寬度和高度屬性設置爲100%,以便填充單元格。


編輯:

所以在CSS:

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

,並刪除通話從事件處理程序$('.gridBtns').on('click')到setWidth。

+0

所以'.question'應該設置爲100%是你在說什麼?如果你不介意,你可以提供你的表格單元格和textarea的CSS樣本嗎?這是否也意味着我不需要'setWidth()'函數? – user1881090

+0

我懷疑你不需要它......或者至少你不需要每次點擊'3'或'4'選項時都調用它。請參閱編輯。 – Juffy

+0

您可以嘗試讓它在我提供的小提琴中工作,因爲在我的應用程序中,當進行選項更改時,我無法使文本區域填充應用程序。我更新了小提琴,所以你可以看到我的意思:http://jsfiddle.net/XM8hG/8/(如果我把它放100%,我保持寬度自動調節,textarea稍微超過表格單元格)在小提琴中,我改變了從3到4個按鈕到3到26個按鈕,這樣你就可以看到textarea的高度發生了什麼 – user1881090

相關問題