如果输入字段的值匹配,则显示div

时间:2012-09-20 17:26:55

标签: javascript input hidden

如果表单中的选定值与div的值匹配,则会出现隐藏的div

用于检测输入字段值的脚本

<script> $(document).ready(function() {
    $("input[name$='sel']").ready(function() {
        var test = $(this).val();

        $("div.desc").hide();
        $("#sel" + test).show();
    }); });

</script>

当输入字段的值正确时,字段的值和应该显示的div

<table><tr><td> <strong><font  size="3" >Payment Method</font></strong>

<p> <?php echo $_POST["sel"]; ?> <input type="radio" name="sel" value="<?php echo $_POST["sel"]; ?>" /> </p>  <!====================================================================================> </td><td> <img src="img/sep.png" />  </td><td> <!====================================================================================> <div id="selCreditCard" class="desc"> <table><tr><td>


<p> <label for="card"><strong>Card Number : </font></strong></label><?php echo $_POST["card"]; ?>
        <input name="card"   type="hidden"  id="card" value="<?php echo $_POST["card"]; ?>"  style="width:85px;" 

class="validate[custom[card]] text-input" /> </p> <br>

<label for="ccv" ><strong>CVV2 Code : </strong></label><?php echo $_POST["ccv"]; ?>
        <input type="hidden"  name="ccv" id="ccv" style="width:30px;margin-bottom:2px;margin-left:12px;" value="<?

php echo $_POST["ccv"]; ?>" />



<br>

<label><strong>Expiration Date</strong>

<p> <label for="mon"><strong>Month : </strong></label><?php echo $_POST["mon"]; ?>
        <input type="hidden"   name="mon" id="mon" style="width:15px;" value="<?php echo $_POST["mon"]; ?>" />

      <label for="yir" ><strong>Year : </strong></label><?php echo $_POST["yir"]; ?>
        <input type="hidden"  name="yir" id="yir" style="width:15px;" value="<?php echo $_POST["yir"]; ?>" />
        </p>

</div> <!====================================================================================> <div id="selPaypal" class="desc" style="display: none;margin-left:20px;margin-top:1px;margin-bottom:1px;"> Please make sure that you have paid the amount on the Paypal payment page.<br> If not click here to proceed <img src="img/ppal.png" height="36" style="margin-bottom:-13px;" onclick="window.open

('paypal/paypal.html','Paypal','width=450,height=300,left=160,top=170');" style="cursor:pointer;"/>  </div> <!====================================================================================> <div id="selWireTransfer" class="desc" style="display: none;margin-left:20px;margin-top:0px;margin-bottom:-5px;"> <font size="0.5"> <strong>Processing Time</strong><br> A bank wire is not an instant transfer. "Two to three business days" are<br> required to process the transfer and 

allow the recipient to see the wired funds.</font> </div> <!====================================================================================> </td></tr></table>

我不能在下一页显示div,即使在字段中输入了正确的值,哪种方法效率会高,或者您认为该代码是否有效?

1 个答案:

答案 0 :(得分:0)

您应该在输入中使用click事件。

<script> 
     $(document).ready(function() {
        var test = $("input[name='sel']").val();
         $("div.desc").hide();
         $("#sel" + test).show();
  });

</script>