如何在jQuery中按屬性選擇元素？

Question

我想通過它的值屬性獲取元素。

這裏是我使用的代碼 -

jQuery(document).ready(function() { 
    jQuery('form input#attribute2').on('focus', function() { 
     var $this = jQuery(this); 
     var $valueofbox = $this.val(); 
     var $form = $this.closest('form'); 
     console.log($form); 
     console.log($valueofbox); 
     var $samebox = $form.find('input.rowvar2[value=$valueofthis]'); 
     console.log($samebox); 
    }); 
}); 

我試圖讓輸入字段與當前選擇的輸入框的值。 此代碼的工作，當我使用 - 的

$form.find('input.rowvar2[value=XXL]'); //notice that the quotes are not required here and it still gets the desired element 

代替

$form.find('input.rowvar2[value=$valueofthis]'); 

或

$form.find('input.rowvar2[value=$this.val()]'); 

有什麼可以在這裏完成，以解決這個問題？有一個更好的方法嗎？

HTML代碼 -

<form role="form"> 
    <div class="col-xs-2"> 

     <label for="attribute2">Size</label> 

     <input type="text" class="form-control" id="attribute2" value="XXL"> 
     <br> 

     <input type="text" class="form-control" id="attribute2" value="M"> 
     <br> 

     <input type="text" class="form-control" id="attribute2" value="XXXL"> 
     <br> 

<div class="row"> 
<!-- some HTML --> 
    <div class="col-xs-3"> 
     <input type="text" class="form-control rowvar1 e27a8e79-ba6a-449f-a64b-e94baf1a098d" placeholder="Blue" disabled=""> 
    </div> 

    <div class="col-xs-2"> 

     <input type="text" class="form-control rowvar2" value="M" disabled=""> 
     <br> 

     <input type="text" class="form-control rowvar2" value="L" disabled=""> 
     <br> 

     <input type="text" class="form-control rowvar2" value="XL" disabled=""> 
     <br> 
    </div> 
</div> 
<!-- some html --> 

<div class="row"> 
<!-- some HTML --> 
    <div class="col-xs-3"> 
     <input type="text" class="form-control rowvar1 e27a8e79-ba6a-449f-a64b-e94baf1a098d" placeholder="Blue" disabled=""> 
    </div> 
    <div class="col-xs-2"> 

     <input type="text" class="form-control rowvar2" value="XL" disabled=""> 
     <br> 

     <input type="text" class="form-control rowvar2" value="XXL" disabled=""> 
     <br> 

     <input type="text" class="form-control rowvar2" value="XXXL" disabled=""> 
     <br> 

     <input type="text" class="form-control rowvar2" value="5XL" disabled=""> 
     <br> 
    </div> 
</div> 


    <button id="submittopost" type="Submit" class="btn btn-success pull-right">Publish Product</button> 
</form> 

Answer 1

我不認爲有在JS任何花哨的字符串替換？只需手動拼接

$form.find('input.rowvar2[value=' + $valueofbox + ']'); 

Answer 2

嘗試使用：

$form.find("input.rowvar2[value=${valueofbox}]");