是否可以在輸入控件中添加按鈕？

我想創建我自己的定製的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

是否可以在輸入控件中添加按鈕？

回答

相關問題