使用 javascript 動態更改 div 標簽的 position

Question

我在頁面右側的div中有一個 ASP 按鈕。 我想通過下拉的onchange事件將 position 動態更改到同一行的左側。

我是這樣做的：

document.getElementById('divButtonGo').style.Paddingleft="80px"

如何使用 Javascript 執行此操作？

Answer 1

您已經提供的示例是javascript。 如果要更改觸發代碼運行的內容，請更改放置它的位置。

從onchange事件，進入由其他東西調用的腳本標記中的function 。

例子

<input type="button" onclick="movediv()" />
<script>
    function movediv(){
        document.getElementById('divButtonGo').style.Paddingleft="80px"
    }
</script>

Answer 2

這里有幾個問題。 按照重要性增加的順序：

1. 您缺少i標簽中的右斜杠。
2. 我在您的 html 中沒有看到“divButtonGo”。 如果它根本不存在，顯然它不會起作用。 如果是，請將其包含在您的代碼片段中。
3. 我很確定設置您需要的樣式elem.style.paddingLeft ，而不是elem.style.Paddingleft
4. 您的腳本未包含在<script>標記中。 所有 Javascript 都必須包含在這些標簽中，並且，為了使該代碼成功運行，它必須放在“divButtonGo”之后，否則您必須連接一個 onload 事件，例如window.onload = function() { /* Bombs away; */ }; window.onload = function() { /* Bombs away; */ };

您的最終結果應該類似於...

<div id="divButtonGo">
My Awesome Content
</div>
<script type="text/javascript">
var el = document.getElementById("divButtonGo");
el.style.paddingLeft = "30px";
</script>

另外，需要注意的是，填充不會完全改變div的 position ，只會改變里面內容的 position 。 如果要更改div的 position ，請使用margin-left （在 JS 中， element.style.marginLeft ，我相信）

編輯：

我忘了你想要它在下拉的 onchange 事件中； 所以你會做類似的事情：

var dropdown = document.getElementById("MyDropDown");
dropdown.onchange = function() {
var el = document.getElementById("divButtonGo");
el.style.paddingLeft = "30px";
};