如何讓輸入內聯顯示？

我似乎無法弄清楚如何以{display: inline}格式在下面的代碼中顯示兩個輸入，以便它們彼此相鄰而不是分開顯示。我看了其他帖子，並嘗試過jQuery，<style>標籤，.setAttribute等，以嘗試添加此CSS樣式。如何讓輸入內聯顯示？

我也嘗試在CSS中使用必需的display: inline命令在HTML中創建一個類。我創建了這個功能來打開我的主頁上的一個按鈕被點擊。一切工作正常，我只是想兩個輸入（文本和按鈕）排列在一起。

任何想法我錯了？我是一名初學者。

var counter = 1; 
var limit = 2; 
var newdiv = document.createElement('div'); 

function addInput(divName){ 
    if (counter == limit) { 
      (counter); 
    } 
    else { 
      nFilter.className = 'input'; 
      newdiv.setAttribute("style", "display: inline;"); 
      newdiv.innerHTML = "<br><input type='text' placeholder='Postal Code' name='myInputs[]'> " + " <input type='button' value='Lets Go!' onclick='url(file:///C:/Users/Joy/Documents/ZapList/HoldingPage.php)'>"; 
      document.getElementById(divName).appendChild(newdiv).span; 
      counter++; 
    } 
}

來源

2014-10-09 JEA

輸入是inline-block通過默認的，所以如果有空間它們將顯示內聯的，如果不是他們將換到下一行。無論是確保包含元素的寬度足以容納你的輸入或嘗試：

newdiv.setAttribute("style", "display: inline;white-space:nowrap;");

停止從包裝的投入，注意，這種風格應用到div不的投入，你實際上可能要刪除display:inline;。

來源

2014-10-10 00:53:00

謝謝。是的 - 我刪除了顯示：內聯，它工作。這裏是我添加了我需要的內容：newdiv.setAttribute（「style」，「width：900px; white-space：nowrap;」）; – JEA 2014-10-10 05:57:41

如果我得到你的權利，那麼你要一個按鈕被點擊時顯示兩個文本框...

你可以把它非常簡單，取文件撰寫命令。

例如

<body> 
<input type="button" value="Click me" onClick="makeSmth()"></input> 
</body> 

<script> 
function makeSmth() { 

    document.write("<br><input type='text' id='textBox01'></input>"); 
} 
</script>

來源

2014-10-09 21:52:34 herzDev

只是使用style ='float：left;'爲每個輸入元素

<html> 
    <head> 
    <title>this is a test</title> 
    <meta content=""> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    </head> 
    <body> 
     <div id="a"></div> 
     <script type="text/javascript"> 
    var counter = 1; 
    var limit = 2; 
    var newdiv = document.createElement('div'); 

    function addInput(divName){ 
    if (counter != limit) { 
     newdiv.innerHTML = "<br><input type='text' placeholder='Postal Code' name='myInputs[]' style='float:left;'> " + " <input type='button' style='float:left;' value='Lets Go!' onclick='url(file:///C:/Users/Joy/Documents/ZapList/HoldingPage.php)'>"; 
     document.getElementById(divName).appendChild(newdiv); 

     counter++; 
    } 
    } 
    addInput("a"); 
     </script> 



    </body> 
    </html>

來源

2014-10-09 23:48:01 Saeid

如何讓輸入內聯顯示？

回答

相關問題