1

因此，由于一些原因，当用户选择他想要的颜色和尺寸时，我需要在产品名称中添加项目颜色和项目尺寸。但是，我只在用户选择了两个选项时才设法更新 h2，并且每次更改选项时我都需要更新标题。

HTML：

<h2 class="item_name" style="float:left;">Quartz-kalvot</h2>

<br><br><strong>V&auml;ri</strong><br />
    <select class="item_Color">
    <option value="Ei valintaa">Valitse väri</option>
    <option value="Violet">Violet</option>
    <!-- ... -->
</select>
<br />
<strong>Koko</strong><br />
    <select class="item_size">
    <option value="Ei valintaa">Valitse koko</option>
    <option data-price="20.00&euro;">25cm x 30cm</option>
    <option data-price="30.00&euro;">50cm x 30cm</option>
    <option data-price="45.00&euro;">100cm x 50cm</option>
</select>

JavaScript：

$(".item_size, item_Color").change(function() {
    var vari = $(".item_Color").val();
    var koko = $(".item_size").val();
    $('.item_name').html("Quartz-kalvot (" + vari + ")(" + koko + ")");
});​

小提琴：http: //jsfiddle.net/WVCzY/

4

5 回答 5

2

您在这里忘记了.类选择器；

$(".item_size, item_Color")...

所以事件不会绑定，要修复；

$(".item_size, .item_Color")...
于 2012-09-28T11:32:53.017 回答
2

http://jsfiddle.net/WVCzY/1/

$(document).ready(function () {
    $(".item_size, .item_Color").change(function () {
     var vari = $(".item_Color").val();
     var koko = $(".item_size").val();
      $('.item_name').html("Quartz-kalvot ("+vari+")("+koko+")");
     });

});​

你只是在第一个.之前错过了一个.item_Color

于 2012-09-28T11:33:02.350 回答
1

您忘记添加 . 前item_Color

$(document).ready(function () {
    //*************. here
    $(".item_size, .item_Color").change(function () {
     var vari = $(".item_Color").val();
     var koko = $(".item_size").val();
      $('.item_name').html("Quartz-kalvot ("+vari+")("+koko+")");
     });

});​
于 2012-09-28T11:32:47.547 回答
0

使 H2 更新一个函数，并在更改事件中调用它。 

$(document).ready(function () {
    $(".item_size").change(function () {
        updateH2();
     });

    $(".item_Color").change(function() {
     updateH2();   
    });

});

function updateH2() {
     var vari = $(".item_Color").val();
     var koko = $(".item_size").val();
      $('.item_name').html("Quartz-kalvot ("+vari+")("+koko+")");
}
于 2012-09-28T11:32:48.343 回答
0

您忘记将点添加到item_Color

它应该看起来像这样

  $(".item_size, .item_Color").change(function () {
于 2012-09-28T11:35:38.647 回答