Wert abrufen und an eine Schaltfläche übergeben

Question

Ich muss den Wert input.number an das Attribut data-quantity der button im div.add übergeben.
Ich brauche auch den select#color Wert für das Attribut data-color desselben button.

Kann mir jemand helfen?

<div class="col-m"> 
    <a href="#" data-toggle="modal" data-target="#myModal1" class="offer-img"> 
     <img src="images/Long-Sleeve-Shirt.jpg" class="img-responsive" alt=""> 
     <div class="offer"> 
      <p><span>Offer</span></p> 
     </div> 
    </a> 
    <div class="mid-1"> 
     <div class="women"> 
      <h6><a href="single.html">Men's Marty Chambray Long-Sleeve Shirt</a></h6> 
     </div> 
     <div class="mid-2"> 
      <p> 
       <label>$14.00</label><em class="item_price">$12.50</em> 
      </p> 
      <div class="block"> 
       <div class="starbox small ghosting"></div> 
      </div> 
      <div class="clearfix"></div> 
     </div> 

     <select id="color"> 
      <option value="red" onclick="color(this.value)">Red</option> 
      <option value="blue">blue</option> 
     </select> 
     <input type="number" name="quantity" id="quantity"></input> 
     <div class="add"> 
      <button class="btn btn-danger my-cart-btn my-cart-b " data-id="1" data-name="Levi's Men's Marty Chambray Long-Sleeve Shirt" data-summary="summary 1" data-price="12.50" data-quantity="2" data-color="Blue" data-image="images/Long-Sleeve-Shirt.jpg">Add to Cart</button> 
     </div> 
    </div> 
</div> 

Answer 1

Da Sie Bootstrap classes in Ihrem Code haben, ich nehme an, Sie auch jQuery haben, dann ist hier etwas, das Sie bei der Suche beginnen zu tun, was Sie wollen:

// Triggers when the input value changes in any way 
$('input#quantity').on('input',function() { 
    // Gets the input value 
    var value = $(this).val(); 

    // This is how to change an element data-attribute 
    $('div.class > button').data("quantity", value); 
}); 

Siehe .on('input') jQuery Ereignis und beide .attr() und .data() jQuery-Methoden für weitere Informationen.

---

Um das data-color Attribut zu ändern, ist es ganz gleich ist:

// Triggers when you select an option 
$('select#color').change(function() { 
    // Gets the current select value 
    var value = $(this).val(); 

    // Now you just need to change the data-color attribute 
    // but you already know how to do it 
}); 

.change() jQuery Ereignis für weitere Informationen.