тег с onclick return false; еще интерактивные

-1

У меня есть ссылка:тег с onclick return false; еще интерактивные

<a id="trigger" href="file.pdf" onclick="return false;">Download pdf</a>

и этот Javascript:

// Check validation and enable or disable the <a> tag 
if($('#input_1').hasClass('valid')) 
{ 
    $('#trigger').prop("onclick", null);  
} 
else // disable the button 
{ 
    $('#trigger')[0].onclick = function() { return false; } 
}

Однако если проверка не пройдена кнопка еще работает даже с

onclick="return false;"

Может кто-то помочь мне понять это и как эффективно отключить тег привязки?

ОБНОВЛЕНИЕ: исправлено $('#trigger')[0].onclick = function() { return false; }, но как только это делается в привязном теге, кнопка все еще служит для загрузки файла.

источник

2015-11-06 BenRacicot

Jquery не имеет 'onclick' метод .. читать методы api events. Почему вы используете встроенный 'onclick' в первую очередь? – charlietfl

@charlietfl woops, исправлено. Кроме того, якорь должен загружать «onclick =» return false; « – BenRacicot

Вам необходимо выполнить одно из следующих действий:

$('#trigger')[0].onclick = function() {return false;}

или

$('#trigger').click(function() {return false;});

источник

2015-11-06 18:24:19 TAGraves

Это верно, однако якорь по-прежнему загружается при нажатии, даже если onclick = "return false;" задавать. – BenRacicot

if($('#input_1').hasClass('valid')) 
{ 
    $('#trigger').attr("onclick", null);  
} 
else // disable the button 
{ 
    $('#trigger').on('click', function(e) { e.preventDefault(); }); 
}

Лучшее использование .preventDefault способ.
Также используйте метод .prop только для элементов управления формой.

источник

2015-11-06 18:23:41 n1kkou

« Использовать метод .prop только для элементов управления формами »- это немного вводить в заблуждение -' .prop() 'следует использовать для свойств. Манипулирование/доступ к свойствам элемента формы является обычным прецедентом, но это не значит, что это вариант использования * только *. – JJJ

Правда, это не только использование элементов управления формой, но я считаю, что более интуитивно отлаживать, для тех, кто работает после вас. – n1kkou

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

Вызов event.preventDefault(), если не действует
Добавить класс к элементу, если не действует. Этот класс будет иметь pointer-events значение Нет, поэтому он не будет отвечать на щелчки
Проверьте, если глобальная переменная JS была установлена

var valid = false; 
 

 
$("#valid-checkbox").change(function() { 
 
    var $this = $(this), 
 
    trigger = $("#trigger"); 
 

 
    if ($this.is(":checked")) { 
 
    valid = true; 
 
    $this.val("valid"); 
 
    trigger.removeClass("disabled"); 
 
    } else { 
 
    valid = false; 
 
    $this.val("invalid"); 
 
    trigger.addClass("disabled"); 
 
    } 
 
}); 
 

 
$("#trigger").click(function(e) { 
 
    if (valid === false || $(this).hasClass("disabled") || $("#valid-checkbox").val() == "invalid") { 
 
    e.preventDefault(); 
 
    } 
 
});

.disabled { 
 
    opacity: 0.5; 
 
    pointer-events: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a id="trigger" href="http://www.keenthemes.com/preview/metronic/theme/assets/global/plugins/jcrop/demos/demo_files/image1.jpg" class="disabled" target="_blank">Download pdf</a> 
 

 
<input type="checkbox" value="invalid" id="valid-checkbox"> 
 
<label for="valid-checkbox">Valid?</label>

источник

2015-11-06 18:46:35

тег с onclick return false; еще интерактивные

ответ

Смежные вопросы