需要帮助将带参数的函数发送到容器

时间:2014-09-04 07:01:28

标签: javascript

您好:我正在尝试基本上有一个容器;然后有按钮基本上发送一个javascript函数在容器中运行;所以我可以使用不同的按钮将相同的功能发送到具有不同参数的容器......

所以 - 每按一次按钮,容器就会被清空,新结果会显示......

我找到了一些为“text”执行此操作的代码;但是当我尝试发送带参数的函数时,它不起作用......

我开始学习JS而不确定要做什么,我确信它可以通过某种方式完成......这是我的代码:

<p id="id57512">How are you?</p>
<button id="b1">Answer</button>
<button id="b2">Question</button>
<button id="b3">Gman Info new</button>
<button id="b4">Run function</button>

<script>
function f1() {document.getElementById("id57512").firstChild.nodeValue="Fine, thank      you.";}
function f2() {document.getElementById("id57512").firstChild.nodeValue="How are you?";}
function f3() {document.getElementById("id57512").firstChild.nodeValue="Gman needs a job.";}
function f4() {document.getElementById("id57512").firstChild.nodeValue="gman_code1(23);";}

var gman_code1 = function(number) {
var result1 = number*2;
console.log(result1);
}

//define the behavior
document.getElementById("b1").addEventListener("click", f1 , false);
document.getElementById("b2").addEventListener("click", f2 , false);
document.getElementById("b3").addEventListener("click", f3 , false);
document.getElementById("b4").addEventListener("click", f4 , false);
</script>
  1. 容器是“p”标签......
  2. 前三个按钮只做普通文字
  3. 第四个按钮是我尝试发送带参数
  4. 的功能的地方
  5. f4功能是我尝试发送功能的地方;它不起作用......
  6. 我有什么遗漏或做错了会解决这个问题吗?或者这是不可行的,需要以其他方式完成?

    我希望有人能帮忙解决这个问题......

    非常感谢...

2 个答案:

答案 0 :(得分:0)

    function f4() {document.getElementById("id57512").firstChild.nodeValue=gman_code1(23);
     //caling gman_code1 and assigning result to p#id57512    
    }


    var gman_code1 = function(number) {
    var result1 = number*2;
    console.log(result1);
    return result1;//add return statement
}

继承人演示http://jsfiddle.net/vikrant47/d0ms9uw5/5/

答案 1 :(得分:0)

这不适用于跨浏览器,通常使用jQuery来操作DOM元素。代码看起来像:

// Shorthand for $( document ).ready() 
// http://learn.jquery.com/using-jquery-core/document-ready/
$(function() {
    //add click event
    $('#b1').click(
        function (event){
            $("#id57512").Val("Fine, thank you.");
            //or call f1();
        }  
    );
    function f1() {
        $("#id57512").Val("Fine, thank you.");
    }
});

演示:http://jsfiddle.net/margusmartsepp/d0ms9uw5/6/