1

我有一个直接取自 FuelUX 文档的 FuelUX 微调器：

<!DOCTYPE html lang="en">
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="http://fuelcdn.com/fuelux/2.3/css/fuelux.min.css" rel="stylesheet" />
    <link href="http://fuelcdn.com/fuelux/2.3/css/fuelux-responsive.min.css" rel="stylesheet" /> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script src="http://fuelcdn.com/fuelux/2.3/loader.min.js" type="text/javascript"></script>
</head>
<body class="fuelux">
    <div id="MySpinner" class="spinner">
        <input type="text" class="input-mini spinner-input">
        <div class="spinner-buttons btn-group btn-group-vertical">
            <button type="button" class="btn spinner-up">
                <i class="icon-chevron-up"></i>
            </button>
            <button type="button" class="btn spinner-down">
                <i class="icon-chevron-down"></i>
            </button>
        </div>
    </div>
</body>
</html>

但是，当微调器以 chrome 呈现时，微调按钮与输入元素分离。旋转按钮可以正常增加和减少输入字段中的整数。除了加载javascript之外，我还需要做些什么来让旋转按钮附加到输入字段？

4

2 回答 2

0

也许您只是缺少 CSS？您可以在此处找到所需一切的详细信息：

https://github.com/ExactTarget/fuelux/wiki/Using-Fuel-UX

于 2013-09-21T20:18:38.753 回答
0

您需要将 class="spinbox" 添加到 class="fuelux" 容器内的 div 中。

<div class="col-lg-12 fuelux">
<div class="spinbox" data-initialize="spinbox" id="mySpinbox">
  <input type="text" class="form-control input-mini spinbox-input">
  <div class="spinbox-buttons btn-group btn-group-vertical">
    <button type="button" class="btn btn-default spinbox-up btn-xs">
      <span class="glyphicon glyphicon-chevron-up"></span><span class="sr-only">Increase</span>
    </button>
    <button type="button" class="btn btn-default spinbox-down btn-xs">
      <span class="glyphicon glyphicon-chevron-down"></span><span class="sr-only">Decrease</span>
    </button>
  </div>
</div>
</div>
于 2017-01-15T17:46:33.397 回答