2015-12-27 3 views
2

Я пытаюсь получить значение ввода пользователем в форме, чтобы перейти к функции javascript в расширении chrome. Проблема в том, что я не знаю, как получить вход пользователя.
Это часть моего файла manifest.json:Как получить значение представления формы popup.html chrome extension

,"browser_action": { 
    "default_icon": "./assets/icon16.png", 
    "default_popup": "popup.html" 

}, 

popup.html т.е. виде я хочу представить:

... 
<script src = "popup.js"></script> 

</head> 
    <body> 
    <p>Enter here</p> 

<div class="ui-widget"> 
    <form id = "form" > 
     <input id = "shows"> </input> 
     <input type = "submit" id = "submitButton"> 
    </form> 

</div> 
<br> 
<br> 
</body> 

Я знаю, что я не могу сделать встроенный JavaScript в расширение хром поэтому я использую addEventListener для прослушивания отправки формы. В настоящее время он вызывает функцию handleClick(), но мне нужно передать значение ввода, и я не уверен, что поставить в качестве параметра. вот мой файл popup.js:

$(function() { 
console.log("console logging works"); 


document.getElementById("form").addEventListener("submit", handleClick()); 


function handleClick(val) { 
    console.log("calling handleClick"); //printing 
    console.log(val); //prints undefined 

    chrome.runtime.sendMessage({ 
     from: "popup", 
     subject: val 
    }); 
} 

});

Я также попробовал это, не сработало:

document.getElementById("form").addEventListener("submit", handleClick(), false); 


function handleClick() { 

    var show = form.elements[0].value; 
    console.log(show); //prints blank 
    chrome.runtime.sendMessage({ 
     from: "popup", 
     subject: show 
    }); 
} 

ответ

3

Когда вы делаете:
.addEventListener("submit", handleClick(), false)
Поставив скобках после handleClick вы вызываете функцию и передавая ее результат addEventListener (который в этот случай undefined, так как ваша функция не имеет return).

То, что вы хотите сделать, это непосредственно передать функцию addEventListener, которая будет заботиться о вызове его с event объектом для вас (это называется callback):
.addEventListener("submit", handleClick, false)

+0

Я попытался это, но что странно, это больше не вызывает функцию, я добавил инструкцию console.log в handleClick(), и ничего не печатается, когда я делаю это так, как вы говорите – stickler

+1

Это означает, что событие 'submit' не запускается для некоторая причина. Дважды проверьте, что элементы, к которым вы подключаете слушателей, действительно существуют 'document.getElementById (« form »)' и что у него есть '' – lleaff

Смежные вопросы