Question

我的代码就像这样

var searchPreferences = new function() {
    this.setValues = localStorage.setItem('searchPreferenceData', JSON.stringify({
        clientName: document.getElementById('clientName').value,
        carrier: document.getElementById('carrierName').value,
        status: document.getElementById('ShipmentStatus').value,
        genericView: document.getElementById('ddl_view').value


    }));
    this.getData = JSON.parse(localStorage.getItem('searchPreferenceData'));
    this.showValues = new function() {
        document.getElementById('clientName').value = GetData.clientName;

    }
}

我这样称呼这个函数

searchPreferences.setValues();

点击按钮内部。但是没有任何值添加到本地存储。任何人都可以指出我做错了吗？

Answer 1

我想编辑我的答案以解释更多：
代码看起来像是Singleton设计模式的实现，但是方式错误。
请记住，在同一个代码语句中分配时实例化一个函数并不是一个好主意。当你实例化一个函数时，成员的类型变成“数据”而不是“函数”：

typeof searchPreferences.getData == "object"

我的意思是像

这样的陈述

var fuc = new function () {}

执行该函数，并将返回的结果分配给func。
如果我们像你一样定义searchPreferences.getData后立即致电searchPreferences，你认为我们得到了什么？你希望它返回null因为你还没有设置任何东西到本地存储，但它返回一个具有输入值的对象。

正确的方法是定义一个funjction并在需要时实例化它，或者以最佳方法，只需定义一个函数并在需要时调用它：

var searchPreferences = function() {}

Answer 2

您已实例化该功能。你需要把它称为对象的成员而不是函数

Answer 3

问题是您需要使用new关键字来实例化该函数，然后才需要使用它。结果成为一个对象并存储在searchPreferences中。它不是一个被调用的函数

Answer 4

setValues不是一个功能。它被设置为调用setItem的结果，这将是未定义的。

您的控制台可能有这样的错误：

未捕获的TypeError：undefined不是函数

将其包裹在一个函数中：

this.setValues = function() {
    localStorage.setItem('searchPreferenceData', JSON.stringify({
        clientName: document.getElementById('clientName').value,
        carrier: document.getElementById('carrierName').value,
        status: document.getElementById('ShipmentStatus').value,
        genericView: document.getElementById('ddl_view').value


    })
};

Answer 5

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var searchPreferences = new function() {

     this.setValues =function(){ 
  try{
alert("i m in");
 localStorage.setItem('searchPreferenceData', JSON.stringify({
        clientName: document.getElementById('clientName').value,
        carrier: document.getElementById('carrierName').value,
        status: document.getElementById('ShipmentStatus').value,
        genericView: document.getElementById('ddl_view').value  
  }));
}catch(err){alert(err.message);}
}

    this.getData =function(){ 
 return JSON.parse(localStorage.getItem('searchPreferenceData'));

}
     this.showValues =   function() {
    try{
        document.getElementById('clientName').value = this.getData().clientName;
   }catch(err){alert(err.message)}   

}




}
</script>
</head>
<body>
<input type="text" id="clientName" />
<input type="text" id="carrierName" />
<input type="text" id="ShipmentStatus" />
<input type="text" id="ddl_view" />
<button  onclick="searchPreferences.setValues()">Store data</button>
<button  onclick="searchPreferences.showValues()">Get data</button>



</body>
</html>

无法将值设置为本地存储

5 个答案: