屌絲的坑人表單神器

今天應那些基佬、屌絲的要求，特意給他們培訓了一下屌絲表單神器，專為坑人存在。

目的是: 學會二維數組數據的提交。

1. 見怪不怪
HTML:

<form action=”” method=”post”>
　　<input type=”text” name=”row1”/>
　　<input type=”submit” value=”提交”/>
</form>

坑人指數：0

吐槽理由：不宜坑人

2. 偶爾偶遇
HTML:

<form action=”” method=”post”>
　　<input type=”text” name=”row[]” />
　　<input type=”text” name=”row[]”/>
　　<input type=”submit” value=”提交”/>
</form>

 坑人指數：1

 吐槽理由：易少寫[]

 

3. 坑人不償命
HTML

<form action=”” method=”post”>
　　<input type=”text” name=”row[1]” />
　　<input type=”text” name=”row[2]”/>
　　<input type=”text” name=”row[field]” />
　　<input type=”text” name=”row[value]”/>
　　<input type=”submit” value=”提交”/>
</form>

 坑人指數：2

 吐槽理由：Key值分不清楚

4. 不信坑不死你丫的
HTML:

<input type=”text” value=”” class=”you”/>


<form action=”” method=”post”>
    <input type=”text” name=”row1”/>
    <input type=”hidden” name=”yade” />
    <input type=”button” class=”go_btn” value=”提交”/>
</form>

JQuery:

$(“.go_btn”).click(function(){
    $(“input[name=’yade’]”).val($(“.you”).val());
    $(this).parent().submit();
})

 坑人指數：3

 吐槽理由：你丫的為啥要把input放到form外面

5. 坑丫坑丫坑到外婆家

HTML:

<form action=”” method=”post”>
    <input type=”text” value=”row1”/>
    <input type=”text” value=”row2” />
    <input type=”button” value=”提交” class=”go_btn”/>
</form>

 坑人指數：4

 吐槽理由：丫的是整哪樣，沒有name叫程序員咋整

解決方案：

JQuery：

$(“.go_btn”).click(function(){
    var parent = $(this).parent();
    var map = [];
     parent .find("input[type=text]").each(function(){
           map.push($(this).val());
    });
   $.ajax({
        url:parent.attr("action"),
        data:{map:map}
    });
}

 

6. 坑坑更健康了
HTML:

<form action=”” method=”post”>
    <input type=”text” name=”row1”/>
    <input type=”text” name=”row2”/>
    <input type=”button” value=”提交” class=”go_btn”/>
</form> 

 坑人指數：3

 吐槽理由：你丫的為啥只接受json數據

解決方案：

JQuery

$(“.go_btn”).click(function(){ 

　　//$(this).parent().serialize(); 

　　$.ajax({
　　　　data:{s:JSON.stringify($(this).parent().serializeArray())}

　})

});

 

7. 不坑不樂意
HTML:

<form action=”” method=”post”>
    <p data-value=”111”>
        <input type=”text” name=”row1”/>
    </p>
    <p data-value=”112”>
        <input type=”text” name=”row2”/>
    </p>
    <input type=”button” value=”提交” class="go_btn"/>
</form>        

坑人指數：5

吐槽理由：又p又input的，你想整哪樣

解決方案：

JQuery

$(“.go_btn”).click(function(){
    var parent = $(this).parent();
    var map = [];
     parent .find("p").each(function(){
           map.push({
                id:$(this).attr("data-value"),
                value:$(this).find("input").val()
        });
    });
   $.ajax({
        url:parent.attr("action"),
        data:{map:map}
    });
}                

 

8. 坑人無節操

HTML:

<form action=”” method=”post”>
<input type=”text” name=”row[1][]” />
<input type=”text” name=”row[2][]”/>
<input type=”text” name=”row[field][]” />
<input type=”text” name=”row[value][]”/>
<input type=”submit” value=”提交”/>
</form>

 

坑人指數：10

吐槽理由：大哥你想整多少維數據，能整成json嗎

 

 

估計該文章太坑了，被嚴重吐槽了，所以被工作人員移出首頁了。