javascript - Execute Change event only if element has a specific attribute -
i need calculations if radio button has attribute data-price
. calculation executed time radio buttons.
i have attached code. can 1 me on this?
<html xmlns="http://www.w3.org/1999/xhtml"> <head id="head1" runat="server"> <title>hotel beds</title> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" ></script> <script type="text/javascript"> $(document).ready(function() { var values = {}; $('input:radio').change(function() { var name = $(this).attr('name'); values[name] = parsefloat($(this).data('price')); var total = 0.0; $.each(values, function(i, e) { total += e; }); $('#total').text(total.tofixed(2)); }); }); </script> </head> <body> <form id="form1"> <div> <input type="radio" name="t1" data-price="25" checked="checked" /> <span>price 25</span> <input type="radio" name="t1" data-price="30" /> <span>price 30</span> <br /> <input type="radio" name="t2" data-price="40" /> <span>price 40</span> <input type="radio" name="t2" data-price="50" /> <span>price 50</span> <br /> <input type="radio" name="g" /><span>male</span> <input type="radio" name="g" /><span>female</span> <input id="total" type="text" /> </div> </form> </body> </html>
i need calculation if radio button has data price attribute.
you can use "has attribute" selector limit selection radio buttons attribute:
$('input:radio[data-price]').change(...
side note: using jquery's css extensions not best practice, because as says in :radio
api documentation, means jquery can't hand off browser's native handling. instead:
$('input[type=radio][data-price]').change(...
Comments
Post a Comment