开发者

Getting value of OptionID when clicking?

How do I get the value of OptionID when clicking on the Add (.plus-link) link?

Each li may contain select (dropdown) or without it.

    <ul>

  <li>
    <div class="menux">
        <div class="text-block">
            <div class="text-holder">
                <h3>  Item Name </h3>
                <p> Description </p>
            </div>
        </div>
        <开发者_Go百科;div optionid="46812" class="price"> <strong>£4.90</strong> </div>
        <div class="add-item">  <a class="plus-link" href="#">plus</a>  </div>
    </div>
</li>

<li>
    <div class="menux">
        <div class="text-block">
            <div class="text-holder">
                <h3> Item Name 2 </h3>                                                                                                      </h3>
                <p> Description  </p>
            </div>
        </div>
    </div>
    <form class="menu-form" action="#">
        <fieldset>
            <a class="plus-link" href="#">plus</a>
            <select id="optionid" class="select">
                <option value="1">9", £3.99</option>
                <option value="2">12", £5.49</option>
            </select>
        </fieldset>
    </form>
</li>

</ul>

Jquery

$(document).ready(function() {
    $("li .plus-link").click(function(event) {
        event.preventDefault();
        alert( $(this).attr("OptionID") );
    });
});


You want to grab the .siblings('.OptionID'). Then assuming you just want the value of that combo box, you would use .val() to get the selected value:

http://jsfiddle.net/MacAnthony/zzrrp/

EDIT

In response to the edit try this. It will look for both the select and the div with the attribute and should be able to traverse trees where it isn't a direct siblings.

http://jsfiddle.net/MacAnthony/zzrrp/4/


You can try this


Edit slightly misunderstood question there and updated for new markup

$(document).ready(function() {
$("li .plus-link").click(function(event) {
    event.preventDefault();
    var prev = $(this).closest('li').find('#optionid, .price');
    var OptionId = prev.val() || prev.attr('optionid');
    console.log(OptionId);
});
});

Example at http://jsfiddle.net/nickywaites/pTPr8/1/


You are trying to get the attribute OptionID using $(this) which refers to the anchor.You should use prev() to traverse the tree and get the selectbox value.

$(document).ready(function() {
    $("li .plus-link").click(function(event) {
        event.preventDefault();
        alert( $(this).prev(".OptionID").val() );
    });
});

In this case. You should use

$(document).ready(function() {
    $("li .plus-link").click(function(event) {
        event.preventDefault();
        alert( $(this).siblings('.OptionID').val() );
    });
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜