i have 3 radio buttons. I want to refresh my page on every click of 1st radio button (ie sel_address).Whenever the user clicks on selected address the page should refresh.I don't want the page to refresh on click of other 2 radio buttons.How can i achieve this ?
<label class="option sel_address">
<input type="radio" value="sel_address" name="delivery_option" checked="checked" id="sel_address">
</label>
<strong>selected address</strong>
<label class="option your_school">
<input type="radio" value="your_school" name="delivery_option" id="your_school">
</label>
<strong>school</strong>
<label class="option rhs_showroom">
<input type="radio" value="showroom" name="delivery_option" id="showroom">
</label>
<strong>Showroom</strong>
<script type="text/javascript">
$("input[name='delivery_option']").click(function() {
.
.
var delivery_value = $(this).val();
if(delivery_value == "your_school" || delivery_value == "showroom"){
//some code
}else{
..
}
}
include below script just before the end of "body" tag.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$("#sel_address").click(function(){
window.location = "";
});
</script>
You can use eq(0)
to select only the first element:
$("input[name='delivery_option']").eq(0).click(function() { console.log('First was clicked'); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <label class="option sel_address"> <input type="radio" value="sel_address" name="delivery_option" id="sel_address"> </label> <strong>selected address</strong> <label class="option your_school"> <input type="radio" value="your_school" name="delivery_option" id="your_school"> </label> <strong>school</strong> <label class="option rhs_showroom"> <input type="radio" value="showroom" name="delivery_option" id="showroom"> </label> <strong>Showroom</strong>
Or the :first
pseudo class selector :
$("input[name='delivery_option']:first").click(function() {
console.log('First was clicked');
});
As BeNdErR and Dekel suggested, use the :first
pseudo-selector to select the first radio button only.
As to reloading the page, use location.reload()
, as suggested on this question .
$("input[type='radio']:first").click(function() { location.reload(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <label class="option sel_address"> <input type="radio" value="sel_address" name="delivery_option" checked="checked" id="sel_address"> </label> <strong>selected address</strong> <label class="option your_school"> <input type="radio" value="your_school" name="delivery_option" id="your_school"> </label> <strong>school</strong> <label class="option rhs_showroom"> <input type="radio" value="showroom" name="delivery_option" id="showroom"> </label> <strong>Showroom</strong>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.