替代JS/JQuery中的許多if/else語句？

我試圖比較許多頁面元素從它們的初始值到它們被用戶更改的內容，以提示它們保存等。替代JS/JQuery中的許多if/else語句？

是否有更好的方法來執行此檢查而沒有多少if/else語句？開關不起作用，因爲有許多不同的值正在檢查，而不是一個有很多情況下的值。任何和所有的提示/指針是受歡迎的，謝謝！

if ($('#InitialhidLeadType').val() != $('#hidLeadType').val()) 
     bIsChange = true; 
    else if ($('#InitialhidProductType').val() != $('#hidProductType').val()) 
     bIsChange = true; 
    else if ($('#InitialhidFixedFilterType').val() != $('#hidFixedFilterType').val()) 
     bIsChange = true; 
    else if ($('#InitialhidMinCreditScore').val() != $('#hidMinCreditScore').val()) 
     bIsChange = true; 
    else if ($('#InitialhidMaxCreditScore').val() != $('#hidMaxCreditScore').val()) 
     bIsChange = true; 
    else if ($('#InitialhidMinLoanAmount').val() != $('#hidMinLoanAmount').val()) 
     bIsChange = true; 

    else if ($('#InitialhidMinLTV').val() != $('#hidMinLTV').val()) 
     bIsChange = true; 
    else if ($('#InitialhidMaxLTV').val() != $('#hidMaxLTV').val()) 
     bIsChange = true; 
    else if ($('#InitialhidMinCLTV').val() != $('#hidMinCLTV').val()) 
     bIsChange = true; 
    else if ($('#InitialhidMaxCLTV').val() != $('#hidMaxCLTV').val()) 
     bIsChange = true; 
    else if ($('#InitialhidPropertyType').val() != $('#hidPropertyType').val()) 
     bIsChange = true; 
    else if ($('#InitialhidPropertyUse').val() != $('#hidPropertyUse').val()) 
     bIsChange = true; 
    else if ($('#InitialhidBankruptcy').val() != $('#hidBankruptcy').val()) 
     bIsChange = true; 
    else if ($('#InitialhidForeclosure').val() != $('#hidForeclosure').val()) 
     bIsChange = true; 
    else if ($('#InitialhidLoanPurpose').val() != $('#hidLoanPurpose').val()) 
     bIsChange = true; 
    else if ($('#InitialhidIsCashout').val() != $.trim($('#hidIsCashout').val())) 
     bIsChange = true; 
    else if ($('#InitialhidNoCreditScore').val() != $.trim($('#hidNoCreditScore').val())) 
     bIsChange = true; 
    else if ($('#InitialhidRelationship').val() != $.trim($('#hidRelationship').val())) 
     bIsChange = true; 
    else if ($('#InitialhidCurrentLoanVA').val() != $.trim($('#hidCurrentLoanVA').val())) 
     bIsChange = true; 
    else if ($('#InitialhidFoundHome').val() != $.trim($('#hidFoundHome').val())) 
     bIsChange = true; 
    else if ($('#InitialhidFHA').val() != $.trim($('#hidFHA').val())) 
     bIsChange = true; 
    else if ($('#InitialhidIsConforming').val() != $.trim($('#hidIsConforming').val())) 
     bIsChange = true; 
    else if ($('#InitialhidMSA').val() != $('#hidMSA').val()) 
     bIsChange = true; 
    else if ($('#InitialhidStatedCreditRating').val() != $('#hidStatedCreditRating').val()) 
     bIsChange = true; 
    else if ($('#InitialhidCampEffectivedate').val() != $('#hidCampEffectivedate').val()) 
     bIsChange = true; 
    else if ($('#InitialhidCampExpirationdate').val() != $('#hidCampExpirationdate').val()) 
     bIsChange = true; 
    else if ($('#InitialhidIsFixedFilter').val() != $('#hidIsFixedFilter').val()) 
     bIsChange = true; 
    else if ($('#InitialhidTestCompaign').val() != $('#hidTestCompaign').val()) 
     bIsChange = true; 

    else if ($('#InitialhidSelectedStates').val() != $('#hidSelectedStates').val()) 
     bIsChange = true; 
    else if ($('#InitialhidVolumeTieredPricing').val() != $('#hidVolumeTieredPricing').val()) 
     bIsChange = true; 
    else if ($('#InitialhidWeekDayCapacity').val() != $('#filterCapacity').val()) 
     bIsChange = true; 
    else if ($('#InitialhidWeekendCapacity').val() != $('#filterCapacityWeekEnd').val()) 
     bIsChange = true; 
    else if ($('#InitialhidHolidayCapacity').val() != $('#filterCapacityHoliday').val()) 
     bIsChange = true; 

///////////////////////////////////// HTML Below ////////////////////////////////////// 

<div id = "changeCheck"> 

<asp:HiddenField ID="InitialhidLeadType" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidProductType" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidFixedFilterType" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMinCreditScore" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMaxCreditScore" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMinLoanAmount" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMaxLoanAmount" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMinLTV" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMaxLTV" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMinCLTV" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMaxCLTV" ClientIDMode="Static" runat="server" /> 

<asp:HiddenField ID="InitialhidWeekDayCapacity" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidWeekEndCapacity" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidHolidayCapacity" ClientIDMode="Static" runat="server" /> 

<asp:HiddenField ID="InitialhidPropertyType" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidPropertyUse" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidBankruptcy" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidForeclosure" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidLoanPurpose" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidIsCashout" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidNoCreditScore" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidRelationship" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidCurrentLoanVA" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidFoundHome" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidFHA" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidIsConforming" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidMSA" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidStatedCreditRating" ClientIDMode="Static" runat="server" /> 

<asp:HiddenField ID="InitialhidCampEffectivedate" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidCampExpirationdate" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidIsFixedFilter" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidTestCompaign" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidSelectedStates" ClientIDMode="Static" runat="server" /> 
<asp:HiddenField ID="InitialhidVolumeTieredPricing" ClientIDMode="Static" runat="server" />

來源

2013-07-17 arcade16

這個問題似乎是題外話題，因爲它是關於代碼審查 – lifetimes

你可以發佈html asweel？我很確定我們可以找到你周圍的方式！ –

是的，HTML會有幫助 - 例如，如果您的隱藏輸入是實際輸入的直接兄弟，您可以只有一個函數接受一個jQuery對象，並將它與next（）元素進行比較，並將您的輸入傳遞給函數 – digiliooo

迭代的元素，比較各一個，如果有變化，提示用戶保存：

var save = false; 

$('[id^="Initial"]').each(function() { 
    if (this.value != $('#'+this.id.replace('Initial','')).val()) save = true; 
}); 

if (save) confirm(' would you like to save ');

通常你會解決這個問題以不同的方式，通過改變元素改變時的變量，而不是在某個時間檢查所有元素：

var save = false; 

$(':input').on('change', function() { 
    save = true; 
}); 

window.onbeforeunload = function() { 
    if (save) confirm(' would you like to save '); 
}

來源

2013-07-17 20:56:13 adeneo

你的不同方法不會檢測到更改字段，雖然... – Bergi

@Bergi - 不，不，如果更改在哪裏作出 – adeneo

我的意思是當某人編輯輸入字段，更改觸發，然後他還原他的編輯，然後單擊提交'。 OP的腳本不會再發布已經存儲的數據，而你的腳本說他們已經改變了。 – Bergi

改變你的方法。而不是檢查所有的值更改，當輸入改變攔截change事件的形式來設置標誌：

$('#some-form-element').on('change', function (e) { 
    // ... set flag here 
});

來源

2013-07-17 20:57:32 ACEfanatic02

這會告訴你，如果任何形式的元素有他們的價值在任何時候改變。

var formIsDirty = false; 
$(document).ready(function() { 
    $(':input').change(function() { 
     formIsDirty = true; 
    }); 
});

當然，如果他們改變的價值回到原來的價值，它不會告訴你的。當您驗證

$(document).ready(function() { 
    $(':input').each(function() { 
     $(this).data('original', $(this).val()); 
    }); 
});

然後：如果這還不夠，你可以這樣做

var formIsDirty = false; 
    $(':input').each(function() { 
     if ($(this).data('original') != $(this).val()) { 
      formIsDirty = true; 
      return false; 
     } 
    });

第二個選項將讓你弄死你隱藏的「初始值」字段。

來源

2013-07-17 20:59:34

試試這個：

var map = [ 
    ['#InitialhidLeadType', '#hidLeadType'], 
    ['#InitialhidProductType', '#hidProductType'], 
    ['#InitialhidFixedFilterType', '#hidProductType'] 
    // etc.. 
]; 
for (var i = 0; i < map.length; i++) { 
    if ($(map[i][0]).val() != $(map[i][1]).val()) { 
     bIsChange = true; 
     break; 
    } 
}

來源

2013-07-17 21:02:26

我想說的是adeneo和ACEfanatic02建議的兩種方法的結合。。。與一捻：

$("input:visible").change(function() { 
    var currID = $(this).prop("id"); 
    var initialValContainer = $("#Initial" + currID); 

    if (initialValContainer.length > 0) { 
     var currVal = $.trim($(this).val()); 
     var initialVal = $.trim(initialValContainer.val()); 

     if (currVal === initialVal) { 
      $(this).addClass("changed"); 
     } 
     else { 
      $(this).removeClass("changed"); 
     } 
    } 
});

在這一點上，只要你準備好檢查，看看是否要保存，可以使用下面的代碼，看看它是否是必要的：

if ($(".changed").length > 0) { 
    **prompt to save** 
}

那方式，代碼只會提示是否至少有一個輸入已被標記爲已更改。這種方法還可以讓用戶「輸入無標籤」，使用戶返回到其原始值，以及如果需要使用$(".changed").removeClass("changed")「重置」所有輸入（例如，如果要保存新值而不重新加載頁面）。

來源

2013-07-17 21:21:44 talemyn

替代JS/JQuery中的許多if/else語句？

回答

相關問題