在使用jscolor设置本地存储之前,如何设置颜色选择器的默认值?

时间:2019-01-31 04:42:16

标签: javascript html local-storage color-picker

在设置本地存储之前,我需要为jscolor颜色选择器设置默认颜色值。不会将值设置为#000000,而是将其覆盖为#ffffff。

我试图设定输入值和记录它,除非它保持得到覆盖它的高速缓存之前。

<div id='panel'style="background-color:lightblue">
  <h3 style="background-color:lightblue">style</h3>
</div>

#panelColor{
  width: 60px;
  position: absolute;
  left: 10px;
  top: 65px;
}
#btn{
  width = 60px;
  position: absolute;
  top: 120px;
}


var colorScript = document.createElement('script')
colorScript.src = 'https://unsensitive-abrasio.000webhostapp.com/jscolor.js'

var ti2 = document.createElement('input')
    ti2.className = "jscolor {onFineChange:'panel.style.color = this.toHEXString()'}"
    ti2.id = "panelColor";
    ti2.value = '000000';

panel.style.color = localStorage.getItem('ti2psc')
    ti2.value = localStorage.getItem('ti2val')
    ti2.onchange = function(){
        localStorage.setItem('ti2psc', panel.style.color)
        localStorage.setItem('ti2val', ti2.value)
    }

var btn = document.createElement('input')
btn.id = 'btn'
btn.setAttribute("type", "button")
btn.value = 'reset'

btn.onclick = function(){
 localStorage.clear();
 location.reload(true);
}

document.head.appendChild(colorScript)
document.getElementById('panel').appendChild(ti2)
document.getElementById('panel').appendChild(btn)

在设置本地存储之前,输入值将预定义为设置值。

代码: https://codepen.io/anon/pen/VgPjyq

0 个答案:

没有答案