Отключить противоположный ввод, если я наберу в другой из пары

Question

Отключить противоположный ввод, если я наберу в другой из пары

0

Как отключить одно поле ввода, если я ввожу в другой из пары, а затем, если я удалил вход, нажав backspace, например, так что в поле ввода ничего нельзя включить повторно во втором поле ввода и наоборот. Код, который я до сих пор ниже, но не работает.

JavaScript:

    //disable the opposite input field
    var ATGvalue = $('input#atgOrderId').val();
    var BQvalue = $('input#bqOrderId').val();

    if ( ATGvalue.length > 0) {
        $('input#bqOrderId').prop("disabled", true);
    } else {
        $('input#bqOrderId').removeAttr("disabled");
    }

    if ( BQvalue.length > 0) {
        $('input#atgOrderId').prop("disabled", true);
    } else {
        $('input#atgOrderId').removeAttr("disabled");
    }

HTML:

<label for="bqOrderId">bqOrderId </label><input name="bqOrderId" id="bqOrderId" type="text" />
<label for="atgOrderId">atgOrderId </label><input name="atgOrderId" id="atgOrderId" type="text" />

Ben Paton 23 окт. 2013, в 11:12

Источник

Теги:

javascript

jquery

disabled-input

prop

2 ответа

0

вам нужно включить свой код внутри события, чтобы проверить, когда пользователь вводит что-то вроде этого:

$(document).on('keyup','#bqOrderId',function(){
   //your code
});

$(document).on('keyup','#atgOrderId',function(){
  //your code
});

после этого:

$('input#bqOrderId').prop("disabled", true);
$('input#atgOrderId').prop("disabled", true);

к этому:

$('input#bqOrderId').attr("disabled",true);
$('input#atgOrderId').attr("disabled", true);

Alessandro Minoccheri 23 окт. 2013, в 07:41

0

Это работает, но работает только при первой загрузке страницы. Мне нужно, чтобы смотреть на длину этих значений непрерывно.
Ben Paton 23 окт. 2013, в 09:23

Ещё вопросы

Это работает, но работает только при первой загрузке страницы. Мне нужно, чтобы смотреть на длину этих значений непрерывно.

Brian North · Accepted Answer · 2013-10-23T06-58-00.000Z

Ваш код работает, но только один раз - чтобы он постоянно обновлялся, вы сначала переносите JS в функцию обработчика событий и присоединяете его к своим входным элементам:

function mutuallyExclusive( e ) { ... }
$( '#bqOrderId' ).on( 'change keyup', mutuallyExclusive );
$( '#atgOrderId' ).on( 'change keyup', mutuallyExclusive );

См. Этот JSFiddle.

Я привязал его как к change и к событиям keyup: change для обработки программных (сценариев) изменений и keyup для "мгновенного" обновления статусов полей - в противном случае он ждет, пока пользователь удалит фокус с входа, чтобы вызвать событие change.