Блог

Главная - Вопросы по программированию - Как написать мою функцию onclick на JavaScript и привязать ее к innerHTML

Как написать мою функцию onclick на JavaScript и привязать ее к innerHTML

#javascript

#javascript

Вопрос:

      var x = 10
     var y = 15
     document.getElementById("text").innerHTML = '<div 
     onclick='test("'x   '","'   y   '") > text  </div>';

Здравствуйте, я здесь новичок, извините за плохое объяснение, но каков синтаксис в функции между js и html, когда я хочу задать параметры функции?
Я должен получить это function : onclick='test(x,y)'

Комментарии:

1. Добро пожаловать! Я вижу, что вы тоже новичок в HTML 😉

Ответ №1:

Похоже, вы пытаетесь установить innerHTML для вашего #text элемента результат test(x, y) Традиционный способ сделать это будет что-то вроде

 const answer = test(x,y)
document.getElementById('idOfThingToBeChanged').innerHTML = answer;

Если вы пытаетесь сделать это при нажатии кнопки на вашей странице, вы бы хотели включить этот код в качестве содержимого в ваш прослушиватель событий, т.Е.

 document.getElementById('idOfThingToBeClicked')
   .addEventListener('click' => {
      (the code from above)
   });

Если X и Y — это значения, которые извлекаются с вашей HTML-страницы, вы бы хотели захватить их что-то вроде

 const x = document.getElementById('idOfElement1').value;
const y = document.getElementById('idOfElement2').value;
const answer = test(x,y);

Чтобы ваш конечный продукт выглядел примерно так

 document.getElementById('elementToBeClicked')
   .addEventListener('click', () => {
      const x = document.getElementById('idOfElement1').value;
      const y = document.getElementById('idOfElement2').value;
      document.getElementById('elementToBeChanged')
         .innerHTML = test(x, y);
});
//This assumes you're injecting this code at a point after the page has loaded

Надеюсь, это охватывает все основы, но дайте мне знать, если я смогу сделать лучше

Ответ №2:

 function test(x,y){
alert(x, y);
}

var x = 10
     var y = 15
     document.getElementById("text").innerHTML = `<div onclick="test(${x},${y})"> text</div>`; 
 <div id="text"></div>

PS: функциональный тест покажет предупреждение, чтобы показать вам, что он работает

Метки: