innerhtml 中的警报按钮答案

【问题标题】：Alert button in innerhtmlinnerhtml 中的警报按钮
【发布时间】：2016-11-21 19:59:12
【问题描述】：

我有一个 javascript 函数可以在 div innerhtml 中调用这个结果。单击按钮时如何提醒“警报功能”？

$html.='<table class="table table-striped table-bordered table-hover">
            <thead>
                <tr>
                    <th width="5%">#</th>
                    <th>Title</th>
                    <th>Action</th>
                </tr>
            </thead>
            <tbody>';
            $c=1;
        foreach($titles AS $item){
            $html.='<tr>
                    <td>'.$c.'</td>
                    <td>'.urldecode($item->title_content).'</td>
                    <td><button type="button" class="btn btn-danger" onclick="alert(\'**Alert Function**\')">Delete</button></td>
                </tr>';
                $c++;
        }
        $html.='</tbody>
         </table>';
        echo $html;

谢谢

【问题讨论】：

这段代码有什么问题？
实际上上面的代码是由 javascrip 调用的，我使用 ajax 将值传递给控制器，然后在 div 中使用 innerhtml 视图。当它显示在 div 上时，但 onclick 按钮不起作用。

标签： javascript php innerhtml codeigniter-3

【解决方案1】：

由于这是PHP，你可以像这样直接插入onClick()事件：

<td><button type="button" id="deleteButton" class="btn btn-danger" onclick="alertFunction()">Delete</button></td>

然后在 JavaScript 文件中：

function alertFunction()
{
    alert('My custom text');
}

让我知道这是否解决了您的问题以及我是否正确理解了您的问题。

如果 onClick() 是用 JavaScript 本身编写的，则删除该部分并在 JavaScript 脚本中添加额外的行：

document.getElementById("deleteButton").addEventListener("click", alertFunction);

【讨论】：

实际上上面的代码是由 javascrip 调用的，我使用 ajax 将值传递给控制器，然后在 div 中使用 innerhtml 视图。当它显示在 div 上时，但 onclick 按钮不起作用。
@MohdHadrulladtfiBinMamat 此外，您可以使用EventListener() 来帮助避免原始文本而不是函数调用。编辑答案。

【解决方案2】：

创建一个单独的函数来处理onclick 事件。如果您想传递任何参数，这将在未来有所帮助

<td><button type="button" class="btn btn-danger" onclick="clickButton()">Delete</button></td>

在脚本标签内的代码中的某处创建一个函数调用clickButton()

function clickButton(){
 alert('Alert Function')
}

【讨论】：

实际上上面的代码是由 javascrip 调用的，我使用 ajax 将值传递给控制器，然后在 div 中使用 innerhtml 视图。当它显示在 div 上时，但 onclick 按钮不起作用。