Question

我有一个按钮：

var button = ($('<button>', {
            "id": "jspsych-free-sort-done-btn",
            "class": "jspsych-free-sort",
            "html": "Done",
            ...
}));

我想要居中。 stackoverflow上的某个人建议使用.wrap（）添加一个包装器div，但这似乎并不是按钮的中心：

button.wrap("<div style='text-align:center'> </div>");

.wrap（）是否取消了包装器的样式属性？如果是这样，我如何居中按钮？谢谢！

Answer 1

一个可能的问题是如何＆amp;当你包装元素，然后如何将按钮添加到dom。

如果在将按钮添加到dom之前将其包裹起来，然后将按钮直接添加到dom中，则包装的div将不会添加到dom中，因此包装不会产生任何影响。

然后包装按钮，然后将按钮的父元素添加到dom中，如

＆＃13;

var button = ($('<button>', {
  "id": "jspsych-free-sort-done-btn",
  "class": "jspsych-free-sort",
  "html": "Done"
}));

button.wrap("<div style='text-align:center'> </div>");

button.parent().appendTo('body')

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

＆＃13;

Answer 2

你可以给你的包裹宽度，例如width:100%; text-align:center;，同时我也可以将margin-left:auto; margin-right:auto;添加到我的按钮风格。

Answer 3

wrap()为button对象创建父元素。您可以使用parent()进行搜索。另一种方法是在使用ID附加后进行换行。

＆＃13;

var button = $('<button>', {
    "id": "jspsych-free-sort-done-btn",
    "class": "jspsych-free-sort",
    "html": "Done"
}).wrap("<div style='text-align:center'> </div>").parent();
button.appendTo('body')

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

＆＃13;

.wrap（）取消包装器样式属性吗？

3 个答案: