如何在选择单选按钮时破坏id中的数据?

时间:2014-09-25 12:49:45

标签: javascript php jquery html

如果像这个函数那样选择单选按钮时如何销毁id中的数据?

............................................... .................................................. .................................................. ..................

首先加载页面index.php,

  1. Check1按钮,您会看到文字PRODUCTS DATA OK
  2. 选中单选按钮SECOND RADIO
  3. 选中单选按钮FIRST RADIO
  4. 您会看到文字PRODUCTS DATA OK
  5. 这是我在步骤2. checked radio button SECOND RADIO中提出的问题 选中单选按钮SECOND RADIO后,我想销毁文字PRODUCTS DATA OK 存储在<p id="myplace_data1"></p>

    我该怎么做?

    的index.php

    <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
    
    <script>
        $(document).ready(function(){
            $(".radio_id").click(function(){
                if($(this).attr("value")=="first"){
                    $("#second_checkbox").hide();                
                    $("#first_checkbox_display").show();
                }
                if($(this).attr("value")=="second"){
                    $("#first_checkbox_display").hide();                
                    $("#second_checkbox").show();    
                }
            });
        });
    </script>
    
    
    <form id="first_checkbox_display" name="form1" method="post" action="" ENCTYPE = "multipart/form-data" onsubmit="return checkform(this);" style=" margin: 0px; " >
    <input type="text" name="products_id" value="1294759">
    <input type="text" name="products_color" value="red">
    <input type="text" name="products_type" value="electronic">
    <input type="button" value="Check1" onclick="doajax_products_check()"/>
    <p id="myplace_data1"></p>
    </form>
    
    
    
    <form id="second_checkbox" name="form2" method="post" action="" ENCTYPE = "multipart/form-data" onsubmit="return checkform(this);" style=" display: none; margin: 0px; " >
    <input type="text" name="products_id" value="0000000">
    <input type="text" name="products_color" value="iiiiiii">
    <input type="text" name="products_type" value="aaaaaaa">
    <input type="button" value="Check2" onclick="doajax_products_check2()"/>
    <p id="myplace_data2"></p>
    </form>
    <br>
    <br>
    <label><input type="radio" class="radio_id" name="colorRadio" value="first" checked >FIRST RADIO</label>
    <br>
    <label><input type="radio" class="radio_id" name="colorRadio" value="second">SECOND RADIO</label>
    
    
    
    
    <script language="javascript">
    function createAjax() 
    {
        var request = false;
            try {
                    request = new ActiveXObject('Msxml2.XMLHTTP');
                }
            catch (err2) 
                {
                    try 
                        {
                            request = new ActiveXObject('Microsoft.XMLHTTP');
                        }
                    catch (err3) 
                        {
                    try 
                               {
                        request = new XMLHttpRequest();
                       }
                    catch (err1) 
                       {
                        request = false;
                       }
                        }
                }
        return request;
    }
    </script>
    
    
    
    <script language="javascript">
    function doajax_products_check(mydata){
     var ajax1=createAjax(); 
     ajax1.onreadystatechange=function(){
      if(ajax1.readyState==4 && ajax1.status==200){
       document.getElementById('myplace_data1').innerHTML=ajax1.responseText;
      }else{
       return false;
      }
     }
     ajax1.open("POST","data.php",true);
     ajax1.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
     ajax1.send("products_color="+document.form1.products_color.value+"&products_type="+document.form1.products_type.value+"&products_id="+document.form1.products_id.value);
    }
    </script>
    
    
    
    
    
    
    
    
    
    <script language="javascript">
    function doajax_products_check2(mydata){
     var ajax1=createAjax(); 
     ajax1.onreadystatechange=function(){
      if(ajax1.readyState==4 && ajax1.status==200){
       document.getElementById('myplace_data2').innerHTML=ajax1.responseText;
      }else{
       return false;
      }
     }
     ajax1.open("POST","data.php",true);
     ajax1.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
     ajax1.send("products_color="+document.form2.products_color.value+"&products_type="+document.form2.products_type.value+"&products_id="+document.form2.products_id.value);
    }
    </script>
    

    data.php

    <?PHP
    if(isset($_POST['products_color']))
        {
            if ( $_POST['products_id'] != '' )
                { 
                    if ( $_POST['products_type'] != '' )
                        {  
    ?>
                            <span class="taken_domain" style=" display: block; margin: 0 auto; " >PRODUCTS DATA OK</span> 
    <?PHP
                        }
                     else
                        {
    ?>
                            <span class="taken_domain" style=" display: block; margin: 0 auto; " >NO PRODUCTS type</span> 
    <?PHP
                        }
                }
            else
                { 
    ?>             
                    <span class="taken_domain" style=" display: block; margin: 0 auto; " >NO PRODUCTS ID</span>             
    <?PHP                
                }
        }
    else
        {
    ?>
            <span class="taken_domain" style=" display: block; margin: 0 auto; " >NO PRODUCTS COLOR</span>    
    <?PHP    
        }    
    ?>
    

1 个答案:

答案 0 :(得分:1)

测试已检查状态并将HTML设置为空白 -

if( $('input[value="second"]').is(':checked') ){
    $('#myplace_data1').html('');
    var products_id = ?; // you'll have to get the product id here
    // make AJAX call here...
    $.post( "delete_product.php", { products_id: products_id, user: user_id } );
}

您所要做的就是创建一个连接数据库并运行查询的PHP文件。

http://api.jquery.com/jquery.post/