如果我单击ajax附加上的链接选项数据列表，我想重定向

Question

如果要在附加ajax中单击选项，我想链接：

更多详情 ：

$('#input-friends').on('input', function () {
    var id = $('#input-friends').val();
    $.ajax({
        url : "<?= $base_url ?>/api/api.php",
        type: "POST",
        data: {id:id},
        success: function(data) {
            console.log(data);
            $("#friends").html("<option value='AA' onclick='test()'>item Appended</option>");
        }
    })
});

<datalist id="friends"></datalist>

函数test（）或链接在append中不起作用:(

Answer 1

尝试这个

$('#input-friends').on('input', function () {
    var id = $('#input-friends').val();
    $.ajax({
        url : "<?= $base_url ?>/api/api.php",
        type: "POST",
        data: {id:id},
        success: function(data) {
            var opt = $('<option>');
            opt.val("AA");
            opt.html("Item Appended");
            opt.click(function(){
                console.log("clicked!");
                test();
            });

            $("#friends").html(opt);
        }
    })
});

<datalist id="friends"></datalist>

或者您可以检查这种解决方案： 在动态创建的元素上进行事件绑定？

Answer 2

您可以使用测试名称创建一个函数

将此代码粘贴到html的标头中

   <script>
    function test(){
    window.location.href = 'http://www.google.com';
    }
    </script>

Answer 3

$（'＃input-friends'）。on（'input'，function（）{
var id = $（'＃input-friends'）。val（）;
$ .ajax（{
网址：“ / api / api.php”，
输入：“ POST”，
数据：{id：id}，
成功：功能（数据）{
console.log（data）;
$（“＃friends”）。html（“追加项目”）;
}
}）
}）;
<input list="friends" name="friends"> <datalist id="friends"></datalist>