清除文本框 脚本不起作用


Clear textboxes Script not working

我有这个form和这个Script,但Script不起作用。我像一个月前一样使用它,它有效,但现在不起作用。

<form method="post">
    <input type="hidden" name="depName" value="<?php echo $_GET['var'];?>">
    <input type="hidden" name="personStat" value="Espera">
    <div class="input1">FirstName :<input type="text" name="fname" class="in1" value="<?php echo $nombre;?>"> <span class="error1">* <?php echo $nombreErr;?></span> </div>
    <div class="input2">LastName :<input type="text" name="lname" class="in2" value="<?php echo $apellido;?>"> <span class="error2">* <?php echo $apellidoErr;?></span> </div>
    <div class="input3">2LastName :<input type="text" name="Slname" class="in3" value="<?php echo $segundoAppellido; ?>"> <span class="error1"><?php echo $segundoAppellidoErr; ?></span> </div>
    <div class="input4">Student Id :<input type="text" name="studentId" class="in4" value="<?php echo $idEstudiante;?>"> <span class="error2"><?php echo $idEstudianteErr; ?></span> </div>
    <input class="buttonClr" type="button" value="Clear">
</form>

脚本

<script> //Funtion that works on buttonClr click
    $(".buttonClr").live('click',function(){ 
        $(this).parents('form').find('input[type="text"]').val(''); //Clear all textboxes
        $('Select').val(''); //Clear the multiple select
    });
</script>

我猜你已经将jquery更新到1.7或更高版本,所以live()不再有效。这是jQuery文档中的解释

从jQuery 1.7开始,.live()方法已被弃用。使用 .on() 附加事件处理程序。使用旧版本的 jQuery 的用户应优先使用 .delegate() 而不是 .live()。

更改脚本,如下所示

<script> //Funtion that works on buttonClr click
    $(".buttonClr").on('click',function(){ 
         $(this).parents('form').find('input[type="text"]').val(''); //Clear all textboxes
         $('Select').val(''); //Clear the multiple select
    });
</script>

工作演示:http://jsfiddle.net/16nu4aom/

尝试使用此脚本来清除输入字段:

 $(".buttonClr").bind('click',function(){ 
      $(this).parents('form').find('input[type="text"]').val(''); //Clear all textboxes
      $('Select').val(''); //Clear the multiple select
 });

我建议您使用重置按钮而不是JS。例:

<form method="post">
    <input type="hidden" name="depName" value="<?php echo $_GET['var'];?>">
    <input type="hidden" name="personStat" value="Espera">
    <div class="input1">FirstName :<input type="text" name="fname" class="in1" value="<?php echo $nombre;?>"> <span class="error1">* <?php echo $nombreErr;?></span> </div>
    <div class="input2">LastName :<input type="text" name="lname" class="in2" value="<?php echo $apellido;?>"> <span class="error2">* <?php echo $apellidoErr;?></span> </div>
    <div class="input3">2LastName :<input type="text" name="Slname" class="in3" value="<?php echo $segundoAppellido; ?>"> <span class="error1"><?php echo $segundoAppellidoErr; ?></span> </div>
    <div class="input4">Student Id :<input type="text" name="studentId" class="in4" value="<?php echo $idEstudiante;?>"> <span class="error2"><?php echo $idEstudianteErr; ?></span> </div>
    <input class="buttonClr" type="reset" value="Clear">
                            <!---^^^^^^^-->
</form>

如果只想重置所有表单字段,则只需添加重置按钮即可。这是一键重置按钮的最简单方法。

<input type="reset" value="Reset"/>