Javascript 使用Materialize.css 1.0.0(不带jQuery)设置下拉选择的值
在我的项目中,我保存select元素的值,并在页面加载时将它们设置为用户上次选择的值。以前只需设置.value=x即可,但现在我无法设置值,只能通过instance.getSelectedValues获取值;根据具体化文件Javascript 使用Materialize.css 1.0.0(不带jQuery)设置下拉选择的值,javascript,materialize,Javascript,Materialize,在我的项目中,我保存select元素的值,并在页面加载时将它们设置为用户上次选择的值。以前只需设置.value=x即可,但现在我无法设置值,只能通过instance.getSelectedValues获取值;根据具体化文件 const selectedCategory = document.querySelector('#category'); const materializeSelectedCategory = M.FormSelect.init(selectedCategory); 。。
const selectedCategory = document.querySelector('#category');
const materializeSelectedCategory = M.FormSelect.init(selectedCategory);
。。。然后在文件准备好之后
materializeSelectedCategory.value = "SET VALUE"; // This does not work...
无法确定如何设置Materialize.css下拉列表的值。我使用多个
我没有使用jQuery
无法确定如何设置Materialize.css下拉列表的值。
materializeSelectedCategory.value=设置值;//这不管用
您需要使用selectedCategory和dispatch change事件:
selectedCategory.value = "1";
if (typeof(Event) === 'function') {
var event = new Event('change');
} else { // for IE11
var event = document.createEvent('Event');
event.initEvent('change', true, true);
}
selectedCategory.dispatchEvent(event);
const selectedCategory=document.querySelector'category';
const materialiseselectedcategory=M.FormSelect.initselectedCategory;
selectedCategory.value=1;
iftypeofEvent==“函数”{
var事件=新事件“变更”;
}否则{
var event=document.createEvent'event';
initEvent'change',true,true;
}
selectedCategory.dispatchEventevent事件;
选择你的选择
选择1
选择2
选择3
物化选择
重新初始化组件
在底层HTMLSelectElement上调度更改事件的另一种方法是在设置值后重新初始化组件。您必须在每次以编程方式更改值(与用户交互相反)时执行此操作,尽管init方法很快:
=> {
M.AutoInit;
const start=document.getElementById'start';
const end=document.getElementById'stop';
const cat=document.getElementById'category';
const out=document.getElementById'manual';
const aut=document.getElementById'auto';
让间隔;
document.addEventListener'change',{target}=>{
out.textContent=target.value;
}
start.addEventListener'单击',=>{
i区间返回;
间隔=设置间隔=>{
cat.value=Math.random*2.toFixed0;
const inst=M.FormSelect.initcat;
aut.textContent=inst.getSelectedValues.join;
},1e3;
};
end.addEventListener'单击',=>{
间隔&clearIntervalinterval;
};
};
选择你的选择
选择1
选择2
选择3
物化选择
通过值:
通过getSelectedValues:
开始
我不确定你是否完全理解我的问题。我有3个下拉列表。在DocumentReady上,我想将它们设置为浏览器的localStorage中存储的内容。将“change”eventListener上每个select元素的值保存到localStorage的效果与预期一样,但当文档准备就绪时,我将从localStorage中提取值,并分别设置每个下拉列表,但不起作用。@TaylorA.Leach将您的值与selectedCategory.value一起使用,然后分派事件。每个人都要这样做。我的代码片段只是一种方式,提示您如何实现一次测试的结果。能帮上忙吗?