jquery - 我如何将这些按钮居中

Question

我的 jQuery 中有两个函数，它们管理两个按钮然后显示它们。我想要的是按钮显示在中心，但 align=center 不起作用。有谁知道如何在我的 jQuery 代码中执行此操作？

jQuery 代码如下:

function insertQuestion(form) {   

    var $answer = $("<table class='answer'></table>");

    $('.allBtns:first-child').each(function() {
        var $this = $(this);
        var $allBtnsClass = '';

        $allBtnsClass = $("<input class='allBtns btnsAll' type='button' style='display: inline-block;' value='Select All Answers' onClick='selectAll(this);' />")
            .attr('name', $this.attr('name'))
            .attr('value', $this.val())
            .attr('class', $this.attr('class'));
        }

        $answer.append($allBtnsClass);
    });

    $('.allRemoveBtns:first-child').each(function() {
        var $this = $(this);
        var $removeBtnsClass = '';

        $removeBtnsClass = $("<input class='allRemoveBtns btnsRemove' type='button' style='display: inline-block;' value='Remove All Answers' onClick='removeAll(this);' />")
            .attr('name', $this.attr('name'))
            .attr('value', $this.val())
            .attr('class', $this.attr('class'));
        }

        $answer.append($removeBtnsClass);
    });

    $tr.append($answer);   
}

Answer 1

我不知道这是否是您唯一的问题，但您将按钮放在表格 中；表格不应直接包含 input 元素。我不认为你需要一张 table 。如果您将容器元素设为 div(例如，使用 answers 类)，您可以在样式表中使用此样式:

.answers { text-align: center; }

然后，如果您停止在 input 按钮上设置 display: inline-block，它们应该默认显示 inline，然后是 text-align:容器的 center 应该负责将它们居中。

您的 JavaScript 还包含过多的 }。只有在与 { 配对时才需要它们。

希望对您有所帮助。