"Отключен" допустимый атрибут для привязывающего тега

Если у меня есть следующий простой сегмент кода:

<div ng-app="myApp">
    <a ng-disabled='true' ng-click="value1=123">click me</a>
    <button ng-disabled='true' ng-click="value2=123">click me</button>
    =={{value1}}==
    =={{value2}}==
</div>

Как вы можете видеть из скрипты: http://jsfiddle.net/basarat/czVPG/ кнопка не доступна для кликов, а ng-click (что просто jquery on('click',function(){})) не выполняется, Однако это выполняется для привязывающего тега.

Это потому, что disabled не является допустимым атрибутом для тега привязки?
Если это почему-то еще вызывает событие dom click, когда кнопка не работает?

Ответ 1

Отключено не является допустимым атрибутом для тега привязки. Источник: http://dev.w3.org/html5/html-author/#the-a-element

Ответ 2

Прочитайте w3c Link и the-a-element

отключить недействительно с привязными тегами

вместо этого вы можете сделать это event.preventDefault()

$('a').click(function(event){
   event.preventDefault();
});

Ответ 3

Нет, он не работает с тегом a, вы можете использовать ссылку jQuery event.preventDefault() здесь

Ответ 4

Кнопка представляет собой тип ввода, поэтому отключить работу. Анкеры не работают одинаково. Попробуйте указать свой тег id и отключить использование javascript.

<div ng-app="myApp">
<a id="someid" ng-click="value1=123" >click me</a>
<button ng-disabled='true' ng-click="value2=123">click me</button>
=={{value1}}==
=={{value2}}==</div>

После этого можно отключить элемент с помощью js, и он должен вести себя как типы ввода.

function DisableButton() {
    var submitButton = document.getElementById("someid");
    if (submitButton != null) {
        submitButton.setAttribute('disabled', 'disabled');
    }
}

Убедитесь, что вы получаете правильный идентификатор клиента вашего элемента.

Ответ 5

Если вы не хотите использовать javascript для отключения привязки (как это предусмотрено в других ответах), вы можете просто опустить атрибут href, и привязка не будет работать и даже изменит свой стиль.

<a>A disabled anchor</a>

Ответ 6

Удаление href или установка его в "#", когда вы действительно хотите отключить его, это немного болезненно, если якорь должен быть включен позже, потому что вам нужно сбросить href на любое значение, на которое он должен ссылаться. Вместо этого я просто добавляю атрибут отключения к тегу, обработчик события click и немного css. Таким образом, якорь можно легко увидеть отключенным, но если он включен, то куда он пойдет.

Да, отключенный не поддерживается атрибут на вкладке привязки, но селектор атрибута CSS находит его, как и jQuery. Таким образом, хотя следующее решение представляет собой смешанный jQuery/javaScipt/CSS, оно предоставляет несколько более приятный способ отключения/включения якорей, который поддерживает динамическое добавление/удаление отключенного атрибута в/из тега с помощью javaScript. Обратите внимание, что это было только проверено и работает в Chrome.

<style>
  a:disabled,               /* This does not do anything, but hopefully one day ... */
  a[disabled]               /* This activates when the disabled attribute is added. */
    {
      cursor: not-allowed;  /* Indicate that the link is not to be click! */
    }
</style>

<script>
  // Use the same css selectors to find all of the disabled anchors ...

  $( 'a:disabled, a[disabled]' )
  .click( function( event ) {

            //
            // Prevent disabled anchors from doing their click action ...
            //
            // Need to recheck that the anchor is still disabled, because the
            // jQuery that initially found this anchor and set this event
            // handler does not affect the anchor after the event is set.
            //

            // Is this anchor still disabled?

            if( this.hasAttribute( 'disabled' ) ) {

              event.preventDefault();

            }

          } );
</script>

Вот демонстрационная программа codePen:https://codepen.io/howardb1/pen/XWrEKzP