如何在第二次单击时重置该值

How to reset the value on the second click

本文关键字：单击 第二次      更新时间：2023-09-26

在第一次点击时，这个值已经被选中，但是当我们第二次点击时，我需要重置这个值。

<div class="form-group">
    <label  for="CreditPoint" class="reqValidation col-lg-2 control-label" style="width: 170px; ">Credit</label>

<div class="form-group">
<label id="reset" for="CreditPoint" class="reqValidation col-lg-2 control-label" style="width: 170px;">Credit</label>
<label for="dummy" class="col-lg-1 control-label" style="width: 5px; "></label>
<div class="creditpoint creditpoint-2" class="form-control col-lg-4" style="width: 500px; ">
    <a href="#" class="creditpoint-1" alt="1" data-val="1"></a>
    <a href="#" class="creditpoint-2" alt="2" data-val="2"></a>
    <a href="#" class="creditpoint-3" alt="3" data-val="3"></a>
    <p class="creditpoint-label">Not Rated</p>
    <label style="width: 170px; ">1 Star - Good, 2 Star - Very Good, 3 Star -Excellent</label>
</div>
Javascript 

$(document).ready(function(){
    $(".creditpoint a").click (function (e){
        var rate = $(this).data("val");
        var cRate = $(".creditpoint-label").data ("rate");
        if (rate == cRate){
            rate = 0;
        }
        $(".creditpoint-label").data ("rate", rate);
        if (rate>0){
            $(".creditpoint-label").html (rate + " Star")
        }else{
            $(".creditpoint-label").html ("Not Rated")
        }
        e.preventDefault();
    });
});
css 

.creditpoint-label {
    width:100%;
    clear:both;   
}
.creditpoint a {
    width:10px;
    height:10px;
    background:#ccc;
    position:relative;
    float:left;
    margin:20px;
}

jsfiddle

相关文章：