Question

为什么这个脚本不起作用？

$(function() {
    var isbn = $('input').val();
    $('button').click(function() {
        $("#data").html('<iframe height="500" width="1000" src="http://books.google.com/books?vid=ISBN' + isbn + '" />');
    });
});

正如您所看到的，我正在尝试为演示网站执行一个非常简单的ISBN查找字段。该脚本应该获取输入的值并将其插入URL。为什么不起作用？

此外，还有更好的方法来实现这一目标吗？

当然，我意识到iframe是垃圾，但我现在只想保持简单。

Answer 1

目前还不清楚你的代码何时被调用，但是这一行：

var isbn = $('input').val();

仅在页面加载时调用一次，而它应该在单击处理程序中：

$('button').click(function() {
    var isbn = $('input').val();
    $("#data").html('<iframe height="500" width="1000" src="http://books.google.com/books?vid=ISBN' + isbn + '" />');
});

Answer 2

为什么不通过ajax加载技术加载你想要查看的页面，所以获取html并在元素中显示它：

$(function() {
    var isbn = $('input').val();
    $('button').click(function() {
        $("#data").load('http://books.google.com/books?vid=ISBN' + isbn);
    });
});

Answer 3

问题不在于您的代码，而是您拥有的查询字符串。

请修改如下，它应该工作：

var isbn = "1603038159";

        $("#data").html('<iframe height="500" width="600" src="http://books.google.com/books?as_isbn=' + isbn);

jQuery变量为iframe URL

3 个答案: