JavaScript如何实现重置功能

JavaScript实现重置功能的方法：【$(document).on('click','.dealFlowSelectedBox_bntBox_left',function(){ $('.dealFlowSelectedBox_...】。

本文操作环境：windows10系统、JavaScript 1.8.5、ThinkPad t480电脑。

JavaScript实现重置功能的具体代码如下所示：

HTML代码：

body>
    !--头部-->
    div class="mui-content">
    	div class="headerBox">
    		a href="javascript:history.go(-1);
    " class="fanhuiBnt">
    			img src="../img/dealFlow/fanhui.png" />
    		/a>
    		筛选条件	/div>
    	div class="dealFlowSelectedBox">
    		div class="dealFlowSelectedBox_tITle">
    			em>
    /em>
    			span>
    支付方式/span>
    		/div>
    		div class="dealFlowSelectedBox_contBox">
    			a href="javascript:void(0);
    " class="dealFlowSelectedBox_payment active">
    img src="../img/dealFlow/quanbu.png" />
    全部/a>
    			a href="javascript:void(0);
    " class="dealFlowSelectedBox_payment ">
    img src="../img/signing/zhifubao.png" />
    支付宝收款/a>
    			a href="javascript:void(0);
    " class="dealFlowSelectedBox_payment ">
    img src="../img/signing/weixin.png" />
    微信收款/a>
    		/div>
    	/div>
    	div class="dealFlowSelectedBox_line">
    /div>
    	div class="dealFlowSelectedBox">
    		div class="dealFlowSelectedBox_title">
    			em>
    /em>
    			span>
    证件资料/span>
    		/div>
    		div class="dealFlowSelectedBox_contBox">
    			a href="javascript:void(0);
    " class="dealFlowSelectedBox_certificate active">
    全部/a>
    			a href="javascript:void(0);
    " class="dealFlowSelectedBox_certificate ">
    收款成功/a>
    			a href="javascript:void(0);
    " class="dealFlowSelectedBox_certificate ">
    退款成功/a>
    			a href="javascript:void(0);
    " class="dealFlowSelectedBox_certificate ">
    收款失败/a>
    		/div>
    	/div>
    	div class="dealFlowSelectedBox_line">
    /div>
    	div class="dealFlowSelectedBox" style="padding: 0;
    ">
    		div class="dealFlowSelectedBox_title" style="margin: 0 0.24rem;
    width: calc(100% - 0.24rem);
    ">
    			em>
    /em>
    			span>
    交易时间/span>
    		/div>
    		ul class="dealFlowSelectedBox_timeBox">
    			li>
    				span>
    开始时间/span>
    				input tyPE="text" id="starDate" name="starDate" value="" placeholder="请选择开始日期" readonly="readonly" />
    				img src="../img/index/index_xyjt.png" />
    			/li>
    			li>
    				span>
    结束时间/span>
    				input type="text" id="endDate" name="endDate" value="" placeholder="请选择结束日期" readonly="readonly" />
    				img src="../img/index/index_xyjt.png" />
    			/li>
    		/ul>
    	/div>
    	div class="dealFlowSelectedBox_bntBox">
    		a href="javascript:void(0);
    " class="dealFlowSelectedBox_bntBox_left">
    重置/a>
    		a href="javascript:void(0);
    " class="dealFlowSelectedBox_bntBox_right">
    确定/a>
    	/div>
    /div>
     /body>
    

JS代码：

script type="text/javascript">
$(document).on('click','.dealFlowSelectedBox_bntBox_left',function(){
    	$('.dealFlowSelectedBox_payment').removeClass('active');
    	$('.dealFlowSelectedBox_certificate').removeClass('active');
    	$('.dealFlowSelectedBox_payment').First().addClass('active');
    	$('.dealFlowSelectedBox_certificate').first().addClass('active');
    	$("input").val('');
}
    )/script>
    

推荐学习：JavaScript视频教程

以上就是JavaScript如何实现重置功能的详细内容，更多请关注其它相关文章！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！