是否可以在输入控件中添加按钮？

我想创建我自己的定制的timepicker，它适用于IE以及Chrome。时间格式为'hh：mm'。所以我创建像是否可以在输入控件中添加按钮？

<input ng-model="timeHours" type="number" class="hours" placeholder="00" min="0" max="23" step="1"> 
<span class="lap-time-sep">:</span> 
<input ng-model="timeMinutes" type="number" class="minutes" placeholder="00" min="0" max="45" step="15">

现在我要永远也显示了“上调向下”微调在IE中。有没有什么方法可以在输入控件中添加我自己的按钮？

来源

2016-09-26 user1147738

它不能添加输入控件内按钮，但你可以把它并将CSS应用于这些按钮，使它看起来像一个组件 –

谢谢当我试图把按钮放在它中，我希望它在右边，但它只是重叠。

– user1147738

CSS：.dashboard -time-up { border：none; background：none; padding：0px; margin-left：-10px; } .dashboard-time-down { border：none; background：none; padding：0px; margin-left：-12px; margin-top：10px; } .up-img {height：10px; margin：0px; align-self：stretch; } 。小时{ 宽度：40px; padding：3px 0 0 3px; float：left; } – user1147738

您不能添加自己的按钮，里面input

你可能（我不知道这一个）能够通过更改CSS要做到这一点，但同样不是一个通用的解决方案为不同的浏览器使用不同的CSS属性来设置自己的input type=number纺纱并没有保证，它会在所有的浏览器

见here

作为变通，就可以实现这一点使用Spinners

将其放置在DOM准备

angular.module("MyApp", []) 
    .controller("MyCtrl", function($scope, $filter) { 
     angular.element(document).ready(function() { 
     $('#hour').spinner({ 
     min: 0, 
     max: 23, 
     step: 1, 
     spin: function(event, ui) { 
      $scope.hh = ui.value; 
      $scope.$apply(); 
      } 
    }); 
    $('#minutes').spinner({ 
     min: 0, 
     max: 45, 
     step: 15, 
     spin: function(event, ui) { 
      $scope.mm = ui.value; 
      $scope.$apply(); 
      } 
    }); 
    }); 
    });

FULL EXAMPLE

您可以更改CSS按您的需求

来源

2016-09-27 04:50:41 Nishant123

是否可以在输入控件中添加按钮？

回答

相关问题