从动态添加的按钮调用函数

时间:2015-12-22 12:43:46

标签: javascript html

我想调用一个函数test(instance),当我点击一个动态添加的按钮时,它接受一个参数作为测试。但是,它以下列方式执行时会引发错误。我在这里做错了什么?

notificationList.forEach(function(hs) {
        console.log(hs);
        htmlStr = "<tr align='center'>";
            htmlStr += "<td>" + hs.notification + "</td>";
            htmlStr += "<td>" + hs.date + "</td>";
            htmlStr += "<td>" + hs.instance + "</td>";

        htmlStr += "<td  > <input style='align-self: center' type='button' align='center' class='btn btn-primary' value='Info'  onclick='test(hs)'> </input> </td>";
        htmlStr += "</tr>";

        index++;
        $("#hs").append(htmlStr);
    });

function test(instance){
    console.log(instance);
}

7 个答案:

答案 0 :(得分:1)

您可以在添加按钮

后立即绑定事件
notificationList.forEach(function(hs) {
    console.log(hs);
    htmlStr = "<tr align='center'>";
        htmlStr += "<td>" + hs.notification + "</td>";
        htmlStr += "<td>" + hs.date + "</td>";
        htmlStr += "<td>" + hs.instance + "</td>";

    htmlStr += "<td>";
    htmlStr += "<input style='align-self: center' type='button' align='center' class='dinamicButton btn btn-primary' value='Info'  onclick='test(hs)'> </input> </td>";
    htmlStr += "</tr>";

    index++;
    $("#hs").append(htmlStr);
    $(".dinamicButton").on("click",test)
});

function test(instance){
  console.log(instance);
}

我已将“dinamicButton”类添加到您的按钮中以使其正常工作。

答案 1 :(得分:0)

您可以在函数上使用jquery。您可以在javascript中添加onclick='test(hs)',而不是添加$('btn btn-primary').on('click', function() { //your code })

btn btn-primary

这将在具有/scripts/upcp --force 类的未来元素上触发。

答案 2 :(得分:0)

尝试:

function convert_number_to_words($number) {

    $hyphen      = '-';
    $conjunction = ' and ';
    $separator   = ', ';
    $negative    = 'negative ';
    $decimal     = ' point ';
    $dictionary  = array(
        0                   => 'zero',
        1                   => 'one',
        2                   => 'two',
        3                   => 'three',
        4                   => 'four',
        5                   => 'five',
        6                   => 'six',
        7                   => 'seven',
        8                   => 'eight',
        9                   => 'nine',
        10                  => 'ten',
        11                  => 'eleven',
        12                  => 'twelve',
        13                  => 'thirteen',
        14                  => 'fourteen',
        15                  => 'fifteen',
        16                  => 'sixteen',
        17                  => 'seventeen',
        18                  => 'eighteen',
        19                  => 'nineteen',
        20                  => 'twenty',
        30                  => 'thirty',
        40                  => 'fourty',
        50                  => 'fifty',
        60                  => 'sixty',
        70                  => 'seventy',
        80                  => 'eighty',
        90                  => 'ninety',
        100                 => 'hundred',
        1000                => 'thousand',
        100000             => 'lakh',
        10000000          => 'crore'
    );

    if (!is_numeric($number)) {
        return false;
    }

    if (($number >= 0 && (int) $number < 0) || (int) $number < 0 - PHP_INT_MAX) {
        // overflow
        trigger_error(
            'convert_number_to_words only accepts numbers between -' . PHP_INT_MAX . ' and ' . PHP_INT_MAX,
            E_USER_WARNING
        );
        return false;
    }

    if ($number < 0) {
        return $negative . $this->convert_number_to_words(abs($number));
    }

    $string = $fraction = null;

    if (strpos($number, '.') !== false) {
        list($number, $fraction) = explode('.', $number);
    }

    switch (true) {
        case $number < 21:
            $string = $dictionary[$number];
            break;
        case $number < 100:
            $tens   = ((int) ($number / 10)) * 10;
            $units  = $number % 10;
            $string = $dictionary[$tens];
            if ($units) {
                $string .= $hyphen . $dictionary[$units];
            }
            break;
        case $number < 1000:
            $hundreds  = $number / 100;
            $remainder = $number % 100;
            $string = $dictionary[$hundreds] . ' ' . $dictionary[100];
            if ($remainder) {
                $string .= $conjunction . $this->convert_number_to_words($remainder);
            }
            break;
        case $number < 100000:
            $thousands   = ((int) ($number / 1000));
            $remainder = $number % 1000;

            $thousands = $this->convert_number_to_words($thousands);

            $string .= $thousands . ' ' . $dictionary[1000];
            if ($remainder) {
                $string .= $separator . $this->convert_number_to_words($remainder);
            }
            break;
        case $number < 10000000:
            $lakhs   = ((int) ($number / 100000));
            $remainder = $number % 100000;

            $lakhs = $this->convert_number_to_words($lakhs);

            $string = $lakhs . ' ' . $dictionary[100000];
            if ($remainder) {
                $string .= $separator . $this->convert_number_to_words($remainder);
            }
            break;
        case $number < 1000000000:
            $crores   = ((int) ($number / 10000000));
            $remainder = $number % 10000000;

            $crores = $this->convert_number_to_words($crores);

            $string = $crores . ' ' . $dictionary[10000000];
            if ($remainder) {
                $string .= $separator . $this->convert_number_to_words($remainder);
            }
            break;
        default:
            $baseUnit = pow(1000, floor(log($number, 1000)));
            $numBaseUnits = (int) ($number / $baseUnit);
            $remainder = $number % $baseUnit;
            $string = $this->convert_number_to_words($numBaseUnits) . ' ' . $dictionary[$baseUnit];
            if ($remainder) {
                $string .= $remainder < 100 ? $conjunction : $separator;
                $string .= $this->convert_number_to_words($remainder);
            }
            break;
    }

    if (null !== $fraction && is_numeric($fraction)) {
        $string .= $decimal;
        $words = array();
        foreach (str_split((string) $fraction) as $number) {
            $words[] = $dictionary[$number];
        }
        $string .= implode(' ', $words);
    }

    return $string;
}

答案 3 :(得分:0)

你没有在报价中给出价值。尝试将值放在引号内,然后尝试。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="addHere"></div>
var Categories = new Schema({
    name     : String
  , subcategories      : {
    name : String,
    model : String
     }
});


var ShopSchema = new Schema({

    Email: {
        type: String,
        default: '',
        trim: true,

    },
    Storename: {
        type: String,
        default: '',
        trim: true
    },
    Type: {
        type: String,
        default: '',
        trim: true
    },
    Categories : [Categories]
});

答案 4 :(得分:0)

您的代码存在一些问题: 首先,input是一个自我结束标记,所以:

<input ...  onclick='test(hs)' />

而不是

<input ...  onclick='test(hs)'> </input>

此外,在HTML的上下文中,hs没有任何意义......您可能希望将"hs"作为字符串传递,如下所示:

<input ...  onclick='test("hs")' />

然后用那个字符串做你想做的事......

答案 5 :(得分:0)

你可以试试这个

notificationList.forEach(function(hs) {
console.log(hs);
htmlStr = "<tr align='center'>";
    htmlStr += "<td>" + hs.notification + "</td>";
    htmlStr += "<td>" + hs.date + "</td>";
    htmlStr += "<td>" + hs.instance + "</td>";
    htmlStr += "<td  > <input style='align-self: center' type='button'    align='center' class='dinamicButton btn btn-primary' value='Info'  onclick='test("hs")'> </input> </td>";
    htmlStr += "</tr>";

index++;
$("#hs").append(htmlStr);
var button=document.getElementsByClassName[0];
button.addEventListener("click", test)
});

function test(instance){
console.log(instance);
}

答案 6 :(得分:0)

Luigonsec解决方案是行

的正确例外
$(".dinamicButton").on("click",test)

您可以添加如下参数:

$(".dinamicButton").on("click",function(){
       test(hs);
});