Question

我有3个文件：index.html，parse.php，profile.html

index.html：它有一个表单，我在其中给出了profile.html的链接和parse.php中的html-dom解析，我应该在同一页面上获取所有数据，即index.html。

我是AJAX的新手，直到现在才使用它。

我应该如何进行操作？

的index.html：

<form action="parse.php" method="post" id="myForm">
Name: <input type="text" name="uurl"><br>
<input type="submit">
</form>

parse.php：

require 'simple_html_dom.php';
$url = $_POST['uurl'];

$html = file_get_html($url);

foreach ($html->find("span[class=full-name]") as $key => $name){
echo $name."<br>";

}

脚本：

<script> 

        $(document).ready(function() { 

            $('#myForm').ajaxForm(function() { 
                alert("Thank you for your comment!"); 
            }); 
        }); 
    </script>

Answer 1

的index.html：

<form action="parse.php" id="myform" method="post">
Name: <input type="text" name="uurl" id="uurl"><br>
<input type="button" value="" >
</form>

<ul class="results"></ul>

包含jquery脚本标记，并添加以下javascript代码：

$(document).ready(function() {
    $('#myform button').on('click', function() {
        $.getJSON('/parse.php', { uurl: $('#uurl').val() }).done(function(a) {
            var html = '';
            if (a.results && a.results.length > 0) {
                for (var i in a.results) {
                    html += '<li>' + a.results[i] + '</li>';
                }
            } else {
                html += '<li class="error">No Results Found</li>';
            }
            $('ul.results').html(html);
        });
    });
});

在parse.php中：

require 'simple_html_dom.php';
$url = $_POST['uurl'];

$results = array();
$html = file_get_html($url);
foreach ($html->find("span[class=full-name]") as $key => $name){
    $results[] = $name;
}

echo json_encode(array('results' => $results));

Answer 2

从技术上讲，你甚至不使用AJAX。 Ajax基于javascript，我在你的代码中看不到任何javascript。

另外，根据我的理解，您不需要任何PHP代码来执行您想要的操作。

您将如何做到这一点。这将是HTML。

<form action="parse.php" method="post">
Name: <input type="text" name="uurl" id="uurl"><br>
<input type="submit" id="submit-form">
</form>

<div id="container">
</div>

然后你需要这个javascript：

var $url = $('#uurl');
var $button = $('#submit-form');
var $container = $('#container');

$button.on('submit', function(evt){
    evt.preventDefault(); //to prevent the default form submission.
    $.get($url.val(), function(response){
        $container.html(response);
    })
});

为了清晰起见，我使用了jQuery，但绝对不需要。

如何使用AJAX显示html-don检索的数据？

2 个答案: