我正在开发一个网络应用程序,供 parent 照顾他们的新生儿。 我为每个任务设置了三个按钮,就像一个进度流,它将显示他们在给定任务中接受的教育程度(例如换尿布的三个步骤(指导 > 在帮助下完成 > 我自己完成))。 单击按钮时,它将改变颜色以指示此步骤已完成。
现在回答问题; 家长必须登录才能查看此“ list ”并单击按钮。假设他们第一次单击按照指示的按钮时,颜色会发生变化。但下次他们登录并继续“ list ”时,他们仍然会看到“指示”按钮已被单击。
Here's a picture how the checklist looks like unclicked
Here's a picture how the checklist looks like with some clicked options.
按钮的代码:
<div class="container" id="checkcontainer">
<h2>Diaper change</h2>
<input type="button" value = "Instructed" style= "color:black" onclick="setColor(this)";/>
<input type="button" value = "Done with help" style= "color:black" onclick="setColor(this)";/>
<input type="button" value = "Done by myself" style= "color:black" onclick="setColor(this)";/>
</div>
更改颜色的脚本(抱歉格式错误):
function setColor(element) {
if(!element.hasAttribute('data-count')){
element.setAttribute('data-count', 1);
}var count = element.getAttribute('data-count');
if(count == 0){
element.style.backgroundColor = '#ffffff';
element.setAttribute('data-count', 1);
} else{
element.style.backgroundColor = '#7fff00';
element.setAttribute('data-count', 0);
}
}
我希望将所选选项存储在我的 phpmyadmin (MySQL) 数据库中,以便家长下次看到按钮更改。 有什么想法可以将代码存储在我的数据库中并在下次显示它吗?
最佳答案
马森
我同意Victor的观点,您可以添加一个字段作为status_button,然后当用户来时页面就知道它是否被点击。
例如,在 Javascript 部分,您可以编写如下内容:
<script type="text/javascript">
var instructed = '<?php echo $data['status_instructed'];?>';
var help = '<?php echo $data['status_help'];?>';
if( instructed == true ){
var a = document.getElementById('button_instructed');
a.style.backgroundColor = '#7fff00'';
}
if( help == true ){
var b = document.getElementById('button_help');
b.style.backgroundColor = '#7fff00'';
}
</script>
$data
是mysqli
结果并带来状态。
您可以更改一点 html 代码:
<input type="button" id="button_instructed" value = "Instructed" style= "color:black" onclick="setColor(this)";/>
<input type="button" id="button_help" value = "Done with help" style= "color:black" onclick="setColor(this)";/>
<input type="button" id="button_myself" value = "Done by myself" style= "color:black" onclick="setColor(this)";/>
关于javascript - 在数据库中保存多次按钮点击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42090350/