Question

我需要从隐藏给用户的元素（style =“display：none”）中提取名称，并将其用于模态中的另一个元素（激活时对用户可见）。

模态字段：

<div class="productAttributeList" style="display: none">
<div class="productAttributeRow productAttributeConfigurableEntryText">
    <div class="productAttributeLabel">
        <label>
            <span class="name">Gift Message:</span>
        </label>
    </div>
    <div class="productAttributeValue">
    <input type="text" class="Field validation productAttributeFluidWidth"
        name="attribute[141]" value=""  />
    </div>
    <div class="cf"></div>
</div>
<div class="productAttributeRow productAttributeConfigurableEntryText">
    <div class="productAttributeLabel">
        <label>
            <span class="name">Delivery Date:</span>
        </label>
    </div>
    <div class="productAttributeValue">
    <input type="text" class="Field validation productAttributeFluidWidth"
        name="attribute[177]" value=""  />
    </div>
    <div class="cf"></div>
</div>

可见字段：

<div class="modal hide fade in" id="product-options">                    
<div class="modal-header center">
    <a class="close modal-close l-m" data-dismiss="modal" 
aria-hidden="true">x</a>                
</div>         
<div class="modal-body ll-m r-m">
    <!--- Delivery Date Field --->
    <div id="datepickerDiv">                   
        <label for="datepicker" class="name rl-m">Desired Delivery Date:</label>
        <br />           
        <input type="text" class="Field validation productAttributeFluidWidth 
rl-m" id="datepicker" value="" placeholder="ex. 01/01/2013"/>    
        <div class="cf"></div>                     
        <hr />
    </div>
    <!---- Gift Message ---->
    <div id="GiftMessageOption" class="top-m btm-m">
        <h5>Gift Message</h5>                    
        <label for="giftMsg">
            <small>Please type your desired message (optional)</small>:<br />
        </label>                       
        <textarea class="Field validation productAttributeFluidWidth" 
id="giftMsg" value=""></textarea>                       
        <div class="cf"></div>                    
    </div> 
</div><!-- end of modal body-->   
<div class="modal-footer">                           
    <button id="modalCancel" class="btn btn-small" data-dismiss="modal" 
aria-hidden="true">Cancel</button>        
    <button href="#" id="addtocart" class="btn btn-small btn-warning">
<i class="icon-shopping-cart icon-white"></i>&nbsp;Add To Cart</button>        
</div><!-- end of modal footer -->

从隐藏字段中，我想从第一个输入[type =“text”]中获取名称，并将其用于模式中的输入[type =“text”] id #datepicker。同样来自隐藏字段我想从第二个输入[type =“text”]获取名称，并将其用于模式中的输入[type =“text”] id #giftMsg。我最近遇到了类似的问题并使用了jQuery .attr（'name'），但无法弄清楚如何在这里应用它...很难搞清楚如何调用值，因为标签和输入为隐藏字段位于不同的div中，共享相同的类。隐藏字段由购物车服务器生成，因此我无法更改它们，而我创建了模态，其中的字段完全可编辑。

以下是我尝试失败的原因：

<script>      
$("#datepicker").attr('name',
$(".productAttributeConfigurableEntryText span.name:contains('(Standard)') input[type=text]").attr('name')); 

$("#giftMsg").attr('name',
$(".productAttributeConfigurableEntryText span.name:contains('(Gift Message)').productAttributeValue input[type=text]").attr('name')); 
</script>

小提琴在这里：Fiddle

谢谢。

Answer 1

这是一种更有条理的方法，知道无线电也可以合并：

/* collect all the inputs, radio, textarea and select*/
var originalInputs=$('.productAttributeList  :input');

var newElArray=[
   /* selector , index of original input*/
  ['#datepicker',0],
   ['#giftMsg',1]
   /* add a selector/index for radios*
]

/* now use index of original input to match to modal fields*/
$.each(  newElArray,function(i,arr){
    var newName= getInputName( arr[1])
     $(arr[0]).attr('name', newName);
     /* simple way to test, display name beside elemnt*/
    $(arr[0]).after( newName);
})



function getInputName( index){
     return originalInputs.eq(index).attr('name');
}

现在，只需为需要命名的每个输入添加[idSelector,index]到newElArray

的 DEMO

使用jQuery从元素中获取名称以用于另一个元素

1 个答案: