使用javascript动态更改div标签的位置

Question

我在页面右侧的div中有一个ASP按钮。我想通过下拉菜单的onchange事件动态地将同一行中的位置更改为左侧。

我是这样做的：

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! */ };

您的最终结果应该类似......

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

另外，要注意，填充不会'确切地改变div的位置，只改变内容的位置。如果您想更改div的位置，请使用margin-left（在JS中，element.style.marginLeft，我相信）

编辑：

我忘记了你想要它在下拉列表的onchange事件中;所以你会做一些像：

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