Question

我对网络开发比较陌生。我在我的网站上使用HTML，jQuery和PHP。我想设计一个表单并以下列方式验证它：

一个简单的网页，有一个输入框 - 连续2行，10行。即key = value | “钥匙”和“钥匙”的一个输入框一个'价值'
在此表单下方，应该有一个“提交”按钮
提交按钮的操作应该是生成网址，如www.abc.com/samplephp?key1=value1&key2=value2&......&key10=value10
Key =值只应附加，如果不为null
当形成并提交网址时，php脚本应处理所有传入的GET参数并将其保存在表格的数据库中

任何人都可以帮助我以这种方式创建表单并使用jQuery根据给定的要求验证它吗？我面临的主要问题是命名文本字段名称并在jQuery中访问它们。我完全搞砸了这个任务。请帮我满足以上四个条件。我会对自己做第五个要求。提前谢谢。

Answer 1

尝试，

<强> PHP

<?php
   $querystring=explode('&',$_SERVER['QUERY_STRING']);
   $newData=array();
   foreach($querystring as $keyPair)
   {
       $kparr=explode('=',$keyPair);
       $key=trim($kparr[0]);
       $value=trim($kparr[1]);
       if($key and $value)
       {
          $newData[$key]=$value;
       }
   }
   print_r($newData);// your final array having valid key values
?>

<强> HTML

<form action="#" method="GET" onsubmit="return false">
    <div>
        <input type="text" name="key[]" value="key1" />&nbsp;<input type="text" name="value[]" value="value1" />
    </div>
    <div>
        <input type="text" name="key[]" value="key2" />&nbsp;<input type="text" name="value[]" value="value2" />
    </div>
    <div>
        <input type="text" name="key[]" value="key3" />&nbsp;<input type="text" name="value[]" value="value2" />
    </div>
    <div>
        <input type="submit" id="btnSubmit" value="Save" />
    </div>
</form>

<强> SCRIPT

$(function(){
    $('#btnSubmit').on('click',function(){
        var qs=[];
        $('input[name="key[]"]').each(function(index){
            k=$(this).val();
            v=$('input[name="value[]"]:eq('+index+')').val();
            if(k && v){// only for non-empty key value pair
                qs.push(k+'='+v);
            }
        });
        alert(qs.join('&'));
        return false;
    });
});

小提琴 http://jsfiddle.net/PdkSd/1

Answer 2

试试这个。

var Keyvalues = ""; 

$("input[type=text]").each(function(){ if($.trim($(this).val()) != ""){
Keyvalues = Keyvalues + $(this).attr("id") + "=" + $(this).val() + "&";
}
 });
Keyvalues = Keyvalues.substring(0, Keyvalues.length - 1); 

alert(Keyvalues);

如何验证以下方案的表单？

2 个答案: