如何将 js 中的函数添加到 html 元素 - 仅在 js 中制作？

Question

如果我 select 是“select”列表的对象，我想更改 table 中一行的背景颜色，但前提是此元素，这是一个偶数。但主要问题是“对象”是在 js 中创建的，所以它不在 html 文件中，所以我无法向对象添加 onclick 函数，这可能会使行变化。请帮忙，我输了。

HTML:

        <select class = "form-select, col-6" id="quantiti" onclick = "ifSelectedLetHeadChange()" >
        <!--
        This was the original version that I copied:
        <select class="form-select, col-6" id="quantiti" 
        onclick="ifSelectedLetHeadChange($(this).val())">
        -->
        </select>

JS:

        function quantity(amount) {
                var select = document.getElementById('quantiti');
            for (var i = 0; i < amount; i++) {
            select.options[select.options.length] = new Option(i + 1, i);
                select.options[select.options.index] = i+1 ;
                select.options[select.options.onclick]="ifSelectedOptionLetTrChange()";
            }
        }
        quantity(10000);

        function ifSelectedOptionLetTrChange(value) {
            if (option.value % 2 ) {
                $("tr").css("background-color", "lightblue");
        } else {
                $("tr").css("background-color", "blue");
            }
        }

Answer 1

您似乎正在使用 JQuery。您可以使用纯 JS 或 JQuery.

JQuery

建议使用更改事件而不是单击事件。但是，更改事件只会在发生更改时触发。我将为此进行更改。

var select = $("#quantiti");
var tr = $("tr");

select.on('change', function() {
  var value = $(this).val();
  setTrColor(value);
});

function setTrColor(value) {
  tr.css("background-color", value % 2 ? "lightblue" : "blue");
}

Javascript

var select = document.getElementsById("quantiti");
var tr = Array.prototype.slice.call(document.getElementsByTagName("tr"));

select.addEventListener("change", function(event) {
  var targetElement = event.target || event.srcElement;
  var value = targetElement.value;
  setTrColor(value);
});

function setTrColor(value) {
  tr.forEach(function(element){
    element.style.backgroundColor = value % 2 ? "lightblue" : "blue";
  });
}

如何将 js 中的函数添加到 html 元素 - 仅在 js 中制作？

How to add a function in js to a html element - which only made in js?

javascript

css

select

function

option

JQuery

Javascript