Javascript ajax html响应自定义显示_Javascript_Php_Jquery_Html_Ajax

Javascript ajax html响应自定义显示

javascript php jquery html ajax

Javascript ajax html响应自定义显示,javascript,php,jquery,html,ajax,Javascript,Php,Jquery,Html,Ajax,我有一个PHP调查表，其中一个问题是你最喜欢的电影是什么？对于这个问题，有一个单选按钮，它的值按标题和演员排列。如果用户选择按参与者，则会出现一个文本框，用户可以在其中使用jQuery自动完成功能编写参与者名称。然后，如果单击此演员的电影按钮，将出现一个新窗口，在该窗口中，他/她将看到插入文本框中的该演员的电影列表。以下是更好地解释的图像：我的问题: 如何将此电影列表显示为可选择的链接或图标，旁边有一个小图像？比如，当我们在文本框中写下一个演员的名字，点击Go按钮，它会显示带有链接和图片的

我有一个PHP调查表，其中一个问题是你最喜欢的电影是什么？对于这个问题，有一个单选按钮，它的值按标题和演员排列。如果用户选择按参与者，则会出现一个文本框，用户可以在其中使用jQuery自动完成功能编写参与者名称。然后，如果单击此演员的电影按钮，将出现一个新窗口，在该窗口中，他/她将看到插入文本框中的该演员的电影列表。以下是更好地解释的图像：

我的问题: 如何将此电影列表显示为可选择的链接或图标，旁边有一个小图像？比如，当我们在文本框中写下一个演员的名字，点击Go按钮，它会显示带有链接和图片的电影列表

这是我的代码：

<html>
<body>
<div id="m_scents2" class="field2" style="display:none;">
    <input type="textbox" name= "tag" id="tags" placeholder="Enter an actor/actress name here" />
    <input type="button" value="Movies by this actor" id="btnRight" />
</div>

<script type="text/javascript">
var selectedVal;

$(document).ready(function () {
//....
//...
if ($(this).val() == "byActor"){
        $("#m_scents").hide();  
        $("#m_scents2").show();
        $("#tags").focus();
        $("#tags").autocomplete({
                     source: "actorsauto.php",
                     minLength: 2,
                     focus: function( event, ui ){
                        event.preventDefault(); 
                        return false;
                     },
                     select: function (event, ui){ 
                        window.selectedVal = ui.item.value;
                     }
                  });  
 });
</script>
</body>
</html>

$('#btnRight').on('click', function (e) {
           popupCenter("movieByactor.php","_blank","400","400");
  });

下面是一个儿童codemovieByactor.php：

<html>
<body>
<div id= "field"
</div>

 <script type="text/javascript">
  var selectedVal = parent.window.opener.selectedVal; 

 $.ajax({
         url: 'childfilm.php',  //THIS IS A PHP FILE CONTAIN QUERY TO SELECT MOVIES BY THE INSERTED ACTOR IN THE TEXTBOX
         datatype: "json",
         data:{q:selectedVal},
         success: function(response) {     
                     $("#field").html(response);
                   }
        });
</script>
</body>
</html>

更新1: 这是childfilm.php：

if(isset($_GET['q']) && !empty($_GET['q'])){
try{ 

    include('imdbConnection.php');
    $sql = $conn->prepare("SELECT DISTINCT movieName FROM cast_movie WHERE castName = :q");
    $sql->execute(array(':q' => $_GET['q']));

    while($rows = $sql->fetch(PDO::FETCH_ASSOC)){
       $option = '<option value="' . $rows['movieName'] . '">' . $rows['movieName'] . '</option>';
       $html .= $option;
       }

    } catch(PDOException $e){
           echo 'ERROR: ' . $e->getMessage();
       }
   echo $html; 
   exit;

您只需要更改输出以适应您的情况。例如，更改此行-

$option = '<option value="' . $rows['movieName'] . '">' . $rows['movieName'] . '</option>';

您可以为每个返回的项目添加所需的图片、图标或任何标记。

您正在寻找jQuey autoComplete吗？@voidmain:否！实际上我可以在自动完成结果中集成一个小图像。。。但这不是我想要的。。请查看我问题中的亚马逊链接，您可能会更好地了解我在寻找什么。您需要更改childfilm.php中的输出以创建链接。当您通过AJAX接收它们并将它们放置在字段中时，它们将作为链接呈现。在这里发布childfilm.php的代码。@voidmain:我在child窗口中没有自动完成！我只想显示电影列表和它们的图像，比如Amazon你在使用什么jquery插件？我已经使用jQueryUI自动完成并选择2OL完成了！是的，我相信：布兰查德=史密斯哈哈哈！是的，它们遍布整个美国，不仅在那里，在新不伦瑞克也是如此。dah cajun住的地方你也知道；阿多尔·勒·冈博·奥斯西；如果可以说，祖父母有最好的拉博纳美食食谱。黑鳄鱼，朱巴拉亚。。。是的，我知道所有关于dat的事情。放任自由！♫鲁勒·阿韦克·勒斯邦斯·顿！我刚看了你的推特档案。老实说，在我写这篇文章之前，我甚至不知道你们都住在卡津郡。你和我是来自另一个世界的兄弟，真的呵呵。音乐家，摄影师，唐人街的建造者。哥们，你们都是一个很好的形象lol-但不包括爸爸的部分lol！守门员：事实上，我有几个朋友住在那里。我想我没能做到。我希望您已将其保存在发送部分。我会向你开枪，你会知道是我。

$option = '<a href=movie.php?title="' . $rows['movieName'] . '">' . $rows['movieName'] . '</a><br />';

http://www.example.com/movie.php?title=Big