具有许多类似功能的替代方案

时间:2016-04-24 14:19:16

标签: javascript jquery

我的网站是一个多页面的网页。根据用户在page1上单击的链接,page2上的表单必须接受用户输入并将其存储在不同的数组中。根据用户点击页面的链接,我必须有一个稍微不同的功能。功能代码如下。 (事先为新手编码道歉,只是通过反复试验来学习)。

function hp1Form() {
    var c = document.getElementById("conductivity").value;
    var p = document.getElementById("ph").value;
    var m = document.getElementById("moisture").value;
    var d = document.getElementById("doxy").value;

    if (isNaN(c) || c < 0 || c > 10000) {
            alert("Conductivity is a value between 0 and 10000");                   
        } else if (isNaN(p) || p < 1 || p > 14) {
            alert("pH is a value between 1 and 14");    
        } else if (isNaN(m) || m < 0 || m > 100) {
            alert("Moisture is a percentage between 0 and 100");
        } else if (isNaN(d) || d < 0 || d > 100) {
            alert("Dissolved oxygen is a value between 0 and 100");     
        }
        else {

    var formattedData = "Date: "+timestamp+" Conductivity (uS): "+c+" pH: "+p+
    " Moisture (%): "+m+" Dissolved oxygen (ppm): "+d;

    var hp1Data = [formattedData];

    var existinghp1Data = JSON.parse(localStorage.getItem("hp1Data"));
    if (existinghp1Data == null) {
        existinghp1Data = [];
    }
    localStorage.setItem("hp1Data", JSON.stringify(hp1Data));
    existinghp1Data.push(hp1Data);
    localStorage.setItem("hp1Data", JSON.stringify(existinghp1Data));

    clearForm();            
        }       

}

function showLog1() {
    $.mobile.changePage ("#log");
    $(document).on("pageshow","#log",function(){
        $("#logPageHeader").text("HP 1");
        var boo = JSON.parse(localStorage["hp1Data"]);
        $("#allLogs").text(boo);
    });
}

以上是用户点击link1时我想要执行的功能。如果他们点击link2,其他一切都保持不变,除了我希望所有提及的更改“hp1Data”,“existinghp1Data”已更改。我目前有5个函数hp1Form(),hp2Form()等

我可以简化代码只使用一个hpForm()函数和一个showLog()函数,并且仍然根据需要进行更改吗?

P.S。我知道几乎肯定有一种更简单的方法可以做我想要的(整体在我的网站上),但我只是想在这一刻这样做。

1 个答案:

答案 0 :(得分:0)

使用参数调用function hpForm(formNumber)以使其为动态。然后在你的函数中你可以localStorage.setItem(formNumber, JSON.stringify(formNumber));。然后,您可以调用hpForm(&#39; hp1Data&#39;),hpForm(&#39; hp2Data&#39;)等等。