是否有可能改變jquery移動表單元素，增加JS的大小％

Question

我想調整我在移動應用中使用Phonegap的jquery移動表單元素的大小。現在，我想調整大小，並根據屏幕大小取決於某個數字或百分比來給出更多高度以形成元素。我自己知道jquery Mobile手柄的寬度，但我想通過JS給出高度，以便所有表單元素的高度都以特定的比例/百分比增加。

我知道JQuery Mobile CSS可以更改，但是我想在運行時使用JS更改高度而不是設置CSS一次。那麼做到這一點的最好方法是什麼？

我其實想要獲得屏幕大小，並根據某個百分比給所有元素的大小。雖然如果我看到jQuery Mobile CSS，那麼我需要設置很多東西，但仍然不確定是否會設置。那麼有沒有辦法做到這一點，而無需修改或重寫整個CSS？或者我只需要編寫自定義CSS和表單元素？

任何建議和努力，將不勝感激。

Answer 1

這裏是一個小提琴證明這與輸入元素：http://jsfiddle.net/ezanker/akgEa/

在這個例子中，我有一個類型的文本輸入3個和你點擊它每次加倍其高度的按鈕。該按鈕遍歷每個輸入，獲取其當前高度，然後將高度設置爲當前的2倍。

<div data-role="fieldcontain"> 
    <label for="textinput-fc1">Text Input:</label> 
    <input type="text" name="textinput-fc1" id="textinput-fc1" placeholder="Text input" value="" /> 
</div> 
<div data-role="fieldcontain"> 
    <label for="textinput-fc2">Text Input:</label> 
    <input type="text" name="textinput-fc2" id="textinput-fc2" placeholder="Text input" value="" /> 
</div> 
    <div data-role="fieldcontain"> 
    <label for="textinput-fc3">Text Input:</label> 
     <input type="text" name="textinput-fc3" id="textinput-fc3" placeholder="Text input" value="" /> 
</div> 

<input id="btnSet" type="button" value="Set Heights" data-theme="a" /> 

$('#btnSet').on("click", function(e){ 
    $("[type='text']").each(function(index) { 
     var curH = $(this).height(); 
     $(this).height(curH * 2); 
    }); 
});  

注意：根據您使用的表單元素的類型，設置高度不適用於所有表單元素。我建議你在檢查器中查看錶單的生成代碼，看看爲每個元素類型設置高度的最佳方法是什麼。