CodePen Link引用的代码应该会产生三个“.col-md-4”div，每个 div 居中(带有偏移量)在单独的行中，但是，这并不是我想要的那样。
我认为我在参数传递和“丢失”变量值方面做错了，尽管无法找出错误。
var wrapWithBootstrap=function(toBeWrapped)
{
toBeWrapped.wrap('<div class="row"></div>');
toBeWrapped.find('.first-div').wrap('<div class="col-md-offset-4 col-md-4"></div>');
toBeWrapped.find('.second-div').wrap('<div class="col-md-offset-4 col-md-4"></div>');
toBeWrapped.find('.third-div').wrap('<div class="col-md-offset-4 col-md-4"></div>');
}
$(document).ready(function()
{
var wrapperDiv=$('<div class="first-div"> This is my first div.</div>');
wrapWithBootstrap(wrapperDiv);
$('#main').append(wrapperDiv);
var wrapperDiv=$('<div class="second-div"> This is my second div.</div>');
wrapWithBootstrap(wrapperDiv);
$('#main').append(wrapperDiv);
var wrapperDiv=$('<div class="third-div"> This is my third div.</div>');
wrapWithBootstrap(wrapperDiv);
$('#main').append(wrapperDiv);
});body
{
padding:32px;
background-color:#bbb;
}
.first-div
{
color:#336;
background-color:#9bb;
font-size:16px;
border: 1px solid #336;
padding:32px;
text-align:center;
}
.second-div
{
color:#363;
background-color:#9b9;
font-size:16px;
border: 1px solid #494;
padding:32px;
text-align:center;
}
.third-div
{
color:#633;
background-color:#b99;
font-size:16px;
border: 1px solid #633;
padding:32px;
text-align:center;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<body>
<div id ="main" class="container-fluid">
</div>
</body>最佳答案
这样做的方式很奇怪，但我不会质疑。不过，我要指出的是，您在同一范围内声明了同一变量三次。
这应该就是您要寻找的内容。请注意，我已经链接了环绕命令，并为其取出了“查找”命令。我还在调用它们进行包装之前附加了这些元素:
var wrapWithBootstrap = function(toBeWrapped) {
toBeWrapped.wrap('<div class="row"></div>').wrap('<div class="col-md-offset-4 col-md-4"></div>');
}
$(document).ready(function() {
var wrapperDiv=$('<div class="first-div"> This is my first div.</div>');
$('#main').append(wrapperDiv);
wrapWithBootstrap(wrapperDiv);
var wrapperDiv=$('<div class="second-div"> This is my first div.</div>');
$('#main').append(wrapperDiv);
wrapWithBootstrap(wrapperDiv);
var wrapperDiv=$('<div class="third-div"> This is my first div.</div>');
$('#main').append(wrapperDiv);
wrapWithBootstrap(wrapperDiv);
});
关于javascript - 用 Bootstrap row 和 col Divs 包装 Div 的函数不影响传递的参数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39300975/