Выберите последний не только для ввода ввода jQuery

Question

Мне нужно выбрать последний вход без атрибута readonly.

Я пробовал input:last:not([readonly]) и input:not([readonly]):last, но, похоже, не работает.

Есть идеи?

РЕДАКТИРОВАТЬ:

Поскольку вы сообщили, что это работает для вас, и я проверил, что это работает на вашей JS Fiddle, вот код ( JS Fiddle здесь ):

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

HTML

Barcode: <input name="barcode" type="text" id="formInput_91" class="form-control" value="" autocomplete="off">

<br>
<table id="table_invoiceProducts" class="table">
   <thead>
      <tr>
         <th>Article</th>
         <th>Descriptio</th>
         <th>Price</th>
         <th>Tax</th>
         <th>Qty</th>
         <th>Subtotal</th>
         <th>Total</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td><input type="text" style="border: none; width: 32px;" name="product[1543338984947183200][productId]" class="adjustInputWidth input_productId" value="456" readonly=""></td>
         <td><input type="text" style="border: none; width: 40px;" name="product[1543338984947183200][description]" class="adjustInputWidth input_description" value="Test"></td>
         <td><input type="number" style="border: none; width: 58px;" name="product[1543338984947183200][price]" class="adjustInputWidth input_priceUnit" data-id="1543338984947183200" value="25.00" min="0" step="0.01"></td>
         <td><input type="number" class="adjustInputWidth input_tax" style="border: none; width: 50px;" data-id="1543338984947183200" value="0.00" name="product[1543338984947183200][tax]"></td>
         <td><input type="number" value="1" min="1" style="border: none; width: 26px;" data-id="1543338984947183200" class="input_quantity adjustInputWidth" name="product[1543338984947183200][quantity]"></td>
         <td><span style="color:#000;" class="span_priceSubTotal" data-id="1543338984947183200">25.00</span></td>
         <td><span style="color:#000;" data-id="1543338984947183200" class="span_priceTotal">25.00</span></td>
      </tr>
      <tr>
         <td><input type="text" style="border: none; width: 40px;" name="product[1543338991430875154][productId]" class="adjustInputWidth input_productId" value="1234" readonly=""></td>
         <td><input type="text" style="border: none; width: 104px;" name="product[1543338991430875154][description]" class="adjustInputWidth input_description" value="Product"></td>
         <td><input type="number" style="border: none; width: 58px;" name="product[1543338991430875154][price]" class="adjustInputWidth input_priceUnit" data-id="1543338991430875154" value="50.00" min="0" step="0.01"></td>
         <td><input type="number" class="adjustInputWidth input_tax" style="border: none; width: 50px;" data-id="1543338991430875154" value="0.00" name="product[1543338991430875154][tax]"></td>
         <td><input type="number" value="1" min="1" style="border: none; width: 26px;" data-id="1543338991430875154" class="input_quantity adjustInputWidth" name="product[1543338991430875154][quantity]" readonly=""></td>
         <td><span style="color:#000;" class="span_priceSubTotal" data-id="1543338991430875154">50.00</span></td>
         <td><span style="color:#000;" data-id="1543338991430875154" class="span_priceTotal">50.00</span></td>
      </tr>
   </tbody>
</table>

JS

    $( document ).ready(function() {

        $('#table_invoiceProducts').on('keydown', 'input:not(:last)', function(e){
            var keyCode = e.keyCode || e.which; 
            if(keyCode == 9 || keyCode == 13){
                e.preventDefault();
                $('#table_invoiceProducts input:not([readonly])')[$('#table_invoiceProducts input:not([readonly])').index(this)+1].focus();
                $('#table_invoiceProducts input:not([readonly])')[$('#table_invoiceProducts input:not([readonly])').index(this)+1].select();
            }
        });

        $('#table_invoiceProducts').on('keydown', 'input:not([readonly]):last', function(e){
            var keyCode = e.keyCode || e.which; 
            if(keyCode == 9 || keyCode == 13){
                e.preventDefault();
                $( '#formInput_91' ).focus();
            }
        });
    });

Answer 1

После 30 минут сна я нашел решение в такт.

Как вы указали, просто input:not([readonly]):last сделайте свое дело.Итак, почему это не сработало для меня?

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

Таким образом, решением было просто выбрать все не readonly и изменить поведение после проверки, еслиэто был последний или нет.

JS Fiddle: http://jsfiddle.net/60x47pu1/3/

По сути, я заменяю код JS, отправленный для этого:

$('#table_invoiceProducts').on('keydown', 'input:not(:last)', function(e){
    var keyCode = e.keyCode || e.which; 
    if(keyCode == 9 || keyCode == 13){
        e.preventDefault();

        if ($('#table_invoiceProducts input:not([readonly])').length == $('#table_invoiceProducts input:not([readonly])').index(this)+1){
            $( '#formInput_91' ).focus();
        }
        else
        {
            $('#table_invoiceProducts input:not([readonly])')[$('#table_invoiceProducts input:not([readonly])').index(this)+1].focus();
            $('#table_invoiceProducts input:not([readonly])')[$('#table_invoiceProducts input:not([readonly])').index(this)+1].select();
        }          
    }
});

Оффтоп: не забывайте спатьхорошо.

Answer 2

$("input").filter(':not([readonly])').last()

пример: https://codepen.io/filipemansano/pen/PxdmoW