Javascript передача параметров в функцию - PullRequest
Новая
       0

Javascript передача параметров в функцию

3 голосов
/ 10 июля 2011

Вопрос новичка: у меня есть следующие функции JavaScript. Это работает правильно, но я не хочу жестко кодировать строки «Names» и «namesDiv». Я хочу передать их как параметры в getItems (). Как мне это сделать?

Редактировать: функция GetMsg () возвращает объект JSON: результат.

HTML: 

<input type="button" onclick="getItems(); return false;" value="Go"/>

JS: 

function getItems() {
   loadingMsg();
   GetMsg("Names", null, callback);
}

function callback(result, args){
   clearContainer();
   //do stuff
   document.getElementById("namesDiv").append(foo);
}

function loadingMsg(){
    clearContainer();
    // do stuff
    document.getElementById("namesDiv").append(foo);   
}

function clearContainer(){
    document.getElementById("namesDiv").innerHTML = "";
}

Ответы [ 4 ]

5 голосов
/ 10 июля 2011

Для половины из них это очевидно;вы просто начинаете передавать параметры в функцию: 

function loadingMsg(containerID) {
    clearContainer(containerID);
    document.getElementById(itemDiv).append(foo);   
}

function clearContainer(containerID) {
    document.getElementById(containerID).innerHTML = "";
}

callback немного сложнее.Мы превратим его в функцию, возвращающую обратный вызов. 

function makeCallback(containerID) {
    function callback(result, args) {
        clearContainer();
        document.getElementById(containerID).append(foo);
    }
    return callback;
}

Теперь мы можем вызвать makeCallback, чтобы получить обратный вызов.Теперь мы можем написать getItems: 

function getItems(itemType, containerID) {
   loadingMsg(containerID);
   GetMsg(itemType, null, makeCallback(containerID));
}
4 голосов
/ 10 июля 2011

Вы можете просто:

HTML 

<input type="button" onclick="getItems('Names', 'namesDiv'); return false;" value="Go"/>

JS 

function getItems(name, div) {
    loadingMsg();
    GetMsg(name, null, function(r, args) { callback(div, r, args); });
}

РЕДАКТИРОВАТЬ: Я думаю, что я охватил все ...

1 голос
/ 10 июля 2011 
 onclick="getItems('namesDiv', 'Names'); return false;"

и затем: 

function getItems(param1, param2) {

param1 будет namesDiv, а param2 будет Names

При этом я бы порекомендовал вам взглянуть на Ненавязчивый JavaScript особенно часть, которая говорит о разделении поведения и разметки.

0 голосов
/ 10 июля 2011

используйте addEventListener вместо встроенного onclick

<input type="button" id="getItems" value="Go" />

JS: 

function getItems(name, id) {
   loadingMsg(id);
   GetMsg(name, null, callback(id));
}

function callback(id){
    return (function() {
        function(result, args){
           clearContainer(id);
           //do stuff
           document.getElementById(id).append(foo);
         }
    })();
}

function loadingMsg(id){
    clearContainer(id);
    // do stuff
    document.getElementById(id).append(foo);   
}

function clearContainer(id){
    document.getElementById(id).innerHTML = "";
}

document.addEventListener("DOMContentLoaded", function() {
    document.getElementById("getItems").addEventListener("click", function() {
        getItems("Names", "namesDiv");
    }, false);
}, false);
...