jquery處理具有相同id，相同名稱和相同值的兩個輸入字段

我有一個表單，其中輸入動態生成具有相同id，相同名稱和相同值的兩個輸入字段。jquery處理具有相同id，相同名稱和相同值的兩個輸入字段

然後，用戶可以更改這兩個類似輸入之一中的任何值（即例如firstname）。如何檢查兩個輸入字段中的值是否相同，如果它們相同，那麼只需提交第一個輸入，如果不相同，則提交更改後的值。

所以最終的提交將只有姓：測試和名字：testtwo

怎麼過，如果一個值改變爲姓大衛不是最終的提交將姓：David和名字：testtwo

<form id="myform" name="myform"> 
    <input type="text" name="firstname" id="firstname" value="test" /> 
    <input type="text" name="firstname" id="firstname" value="test"/> 
    <input type="text" name="lastname" id="lastname" value="testtwo" /> 

</form>

來源

2017-08-08 user3548161

你不能與 – Ryan

您可以使用類相似的元素組相同的ID您的標記2個元素。 ID僅針對一個元素。 – zfrisch

你應該使用類。 ID根據定義是唯一的。 – shabs

試試這個：

$(document).ready(function(){ 
 
    $("#submit").click(function(){ 
 
    var first_name = $("#firstname").val() 
 
    var last_name = $("#firstname_verification").val() 
 
    
 
    if(first_name!=last_name){ 
 
     console.log("please varify your name") 
 
     // do something here 
 

 
    } else{ 
 
     console.log("name varified") 
 
     // do something here 
 
    } 
 
    }) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="myform" name="myform"> 
 
    <input type="text" name="firstname" id="firstname" value="test" /> 
 
    <input type="text" id="firstname_verification" value="test"/> 
 
    <input type="text" name="lastname" id="lastname" value="testtwo" /> 
 

 
</form> 
 

 
<button id="submit">Submit</button>

另外：

$(document).ready(function(){ 
 

 
    $("#submit").click(function(){ 
 
    $("form").each(function(){ 
 
    var $arr = $(this).find(':input') 
 
    //get key/value pair 
 
    var values = {}; 
 
    $arr.each(function() { 
 
     values[this.name] = $(this).val(); 
 
    }); 
 
     console.log(values) 
 
    //get only values in a single array 
 
    var val_arr = [] 
 
    $arr.each(function() { 
 
     val_arr.push($(this).val()); 
 
    }); 
 
    console.log(val_arr) 
 
    // 
 
    if(val_arr[0] === val_arr[1]){ 
 
     console.log("name varified") 
 
    } else { 
 
    console.log("please varify your name") 
 
    } 
 
    
 
     
 
}); 
 
}) 
 

 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="myform" name="myform"> 
 
     <input type="text" name="firstname" id="firstname" value="test" /> 
 
     <input type="text" id="firstname_verification" value="test"/> 
 
     <input type="text" name="lastname" id="lastname" value="testtwo" /> 
 

 
    </form> 
 

 
    <button id="submit">Submit</button>

來源

2017-08-08 23:40:27 dawit

很好，如果我有什麼50場，需要做對他們比較有使用每個 – user3548161

我已經更新了我的解決方案爲您 – dawit

讓我知道如果您有任何顧慮 – dawit

https://jsfiddle.net/es9ff4c4/2/

我與許多人的初步意見指出，千萬不要使用標識超過一個元素。在這種情況下，由於它是一種形式，我們不需要第二個框的名稱。這只是驗證我們已經提交的元素。對於一個ID，我決定把它恰當地，「firstname_verification」

HTML

<form id="myform" name="myform"> 
    <input type="text" name="firstname" id="firstname" value="test" /> 
    <input type="text" id="firstname_verification" value="test"/> 
    <input type="text" name="lastname" id="lastname" value="testtwo" /> 

</form>

的JavaScript/JQuery的

$("#myform").on("submit", function(e) { 
let $box1val = $("#firstname").val(); 
let $box2val = $("#firstname_verification").val(); 

if($box1val != $box2val) { 
alert('Please Verify First Name'); 
e.preventDefault(); 

} 

});

請參閱演示在這裏： https://jsfiddle.net/es9ff4c4/2/

來源

2017-08-08 22:31:34 zfrisch

更改HTML

HTML

<form id="myform" name="myform"> 
    <input class="person" type="text" name="firstname" id="firstname" value="test" /> 
    <input class="person" type="text" name="firstname" id="secondname" value="test"/> 
    <input class="person" type="text" name="lastname" id="lastname" value="testtwo" /> 

</form>

SCRIPT

var elements = document.getElementByClass('person'); 

console.log(elements[0].value) // print test.

來源

2017-08-08 22:33:55

jquery處理具有相同id，相同名稱和相同值的兩個輸入字段

回答

相關問題