| | |
| | | margin-left: 10px; |
| | | padding-left: 5px; |
| | | height: 20px; |
| | | border: 1px solid #777777; |
| | | overflow:hidden; |
| | | white-space:nowrap; |
| | | text-overflow:ellipsis; |
| | | } |
| | | .form-box button { |
| | | #confirm { |
| | | padding: 5px 20px; |
| | | } |
| | | |
| | | .number-tool { |
| | | margin-left: 10px; |
| | | padding: 1px 0 1px 5px; |
| | | display: inline-block; |
| | | width: 120px; |
| | | } |
| | | .number-tool:after { |
| | | clear: both; |
| | | content: ""; |
| | | display: table; |
| | | } |
| | | .number-tool button { |
| | | background-color: #fff; |
| | | margin-top: 2px; |
| | | font-size: 13px; |
| | | height: 18px; |
| | | float: left; |
| | | width: 20px; |
| | | border: 1px solid #777777; |
| | | } |
| | | .number-tool input { |
| | | text-align: center; |
| | | height: 20px; |
| | | float: left; |
| | | margin: 0 5px; |
| | | width: 30px; |
| | | padding: 0; |
| | | } |
| | | </style> |
| | | </head> |
| | |
| | | <input type="text" disabled="disabled"> |
| | | </div> |
| | | <div class="form-item"> |
| | | <span>数量</span> |
| | | <input type="number" > |
| | | <span style="vertical-align: middle">数量</span> |
| | | <div class="number-tool" style="vertical-align: middle"> |
| | | <button onclick="add()">+</button><input id="count" type="number" value="1"><button onclick="reduce()">-</button> |
| | | </div> |
| | | |
| | | </div> |
| | | <button id="confirm">提取</button> |
| | | </div> |
| | | |
| | | </body> |
| | | <script> |
| | | var countDom = $('#count'); |
| | | var pageCurr; |
| | | layui.use(['table','laydate', 'form'], function() { |
| | | var table = layui.table; |
| | |
| | | } |
| | | }); |
| | | |
| | | function add() { |
| | | countDom.val(Number(countDom.val()) + 1); |
| | | } |
| | | function reduce() { |
| | | if (countDom.val() <= 0) { |
| | | return; |
| | | } |
| | | countDom.val(countDom.val() - 1); |
| | | } |
| | | |
| | | </script> |
| | | </html> |