繁体   English   中英

我如何在 form_input() codeigniter 中放置 javascript 数据属性

[英]how can i place javascript data attribute in form_input() codeigniter

这是我的代码,我如何在 form_input() codeigniter 中放置 javascript 数据属性?

$experience=array(
    'name'=>'experience',
    'class'=>'slider tags',
    'id'=>'experience',
    'data-slider-min'=>1,
    'data-slider-max'=>15,
    'data-slider-step'=>1,
    'data-slider-value'=>[5,10]
);
echo form_input($experience); ?>

看看这段代码它可能会帮助你克服这个问题

                        <?php
                        $experience=array(
                            'name'=>'experience',
                            'class'=>'slider tags',
                            'id'=>'experience',
                            'data-slider-min'=>0,
                            'data-slider-max'=>15,
                            'data-slider-step'=>1,
                            'data-slider-value'=>['5','10'],
                            'value'=>3,4

                        );
                      echo form_input($experience); 
                    ?>

您是否尝试过简单地将 JS 属性移动到用于创建输入的 $experience 变量中?

$experience=array(
    'name'=>'experience',
    'class'=>'slider tags',
    'id'=>'experience',
    'data-slider-min' => 1,
    'data-slider-max' => 15,
);

等等...

// HTML代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <script src="main.js"></script>
  </head>
  <body>
    <li class="item" data-done-state="true">Erster Eintrag</li>
    <li class="item" data-done-state="false">Zweiter Eintrag</li>
    <li class="item" data-done-state="true">Dritter Eintrag</li>
  </body>
</html>

//CSS代码

li {
  background-color: khaki;
  margin: 2px;
  padding: 2px;
}

[data-done-state="true"] {
  text-decoration: line-through;
}

//JS代码

window.onload = function() {
  const nodes = document.querySelectorAll(".item");
  for (const node of nodes) {
    node.addEventListener("click", function(elem) {
      switchDoneState(elem);
    });
  }
};

function switchDoneState(elem) {
  const isDone = JSON.parse(elem.target.getAttribute("data-done-state"));
  elem.target.setAttribute("data-done-state", !isDone);
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM