Question

我有一个包含5个字段的Php输入系统：Number，Link，Article，Name和Date。我试图将信息带入2个不同的下拉菜单中。例如，我在数据库中有：

1 ........ http链接..... Bloomberg Links ........ Bloomberg .... 2017-03-22 2 ........ http链接.....福布斯链接........... 福布斯 ....... 2017-03-22 < / p>

所以，我需要带有彭博名称的文章进入Bloomberg下拉菜单和带福布斯名称的文章进入福布斯下拉菜单。

目前，我在页面上有2个下拉菜单，彭博和福布斯的文章都进入了两个菜单，因为我不知道如何让它们进入正确的状态下拉式菜单。该页面为http://www.althedge.xyz/new.html

我很欣赏有人可以向我展示一些代码，这些代码可以让Bloomberg的文章进入Bloomberg下拉菜单，福布斯的文章会进入Forbes下拉菜单。 html代码和php代码如下。谢谢你的帮助？

<?php

// Database Settings 
define('DB_HOST', 'localhost');
define('DB_PORT', '*****');
define('DB_USER', '*****');
define('DB_PASS', '*****');
define('DB_NAME', '*****');

// Connection to Database
$database = new MySQLi(DB_HOST, DB_USER, DB_PASS, DB_NAME, DB_PORT);

$sql = 'SELECT * '
        . ' FROM crypto ORDER BY Date DESC, Number DESC';

$resultSet = $database->query($sql);

$currentDate = false;
while ($row = $resultSet->fetch_assoc())

{
if ($row['Date'] != $currentDate){
 echo
$row['Date'] ;

$currentDate = $row['Date'];  
}


echo


'<a rel="nofollow" rel="noreferrer"href="'.  
 $row["Link"].
 '"style="text-decoration: none;"'.
 '">'. 
 $row["Article"].
 '</A>'.
 '</sub><div style="height: 25px;"></div></li><li>';


 } 


$html .= '</ul></li></table>';

echo $html;

?>

<html >

<head>
  <meta charset="UTF-8">

  <title>hedge</title>




<style>

li {
    line-height: 1.10;
}

@font-face {
    font-family: MesloLGL-Regular;
    src: url(/MesloLGL-Regular.ttf);
}

span *
{

   font-size: 12px !important;
}

body * { 
    background: black;
    font-family: MesloLGL-Regular !important;
    font-size: 12px !important;
}

body {
    background-color: #000;
    text-align: center;
    padding-top: 50px;
}

.nav {
    display: block;
    margin: 0; 
    padding: 0;
}

.nav li {
    display: inline-block;
    list-style: none;
}

.nav .button-dropdown {
    position: relative;
}

.nav li a {
    display: block;
    color: #fff;
    background-color: #000;
    padding: 0px 20px;
    text-decoration: none;
}

.nav li a span {
    display: inline-block;
    margin-left: 5px;
    font-size: 10px;
    color: #FFF;
}

.nav li a:hover, .nav li a.dropdown-toggle.active {
    background-color: #000;
    color: #fff;
}

.nav li a:hover span, .nav li a.dropdown-toggle.active span {
    color: #fff;
}

.nav li .dropdown-menu {
    display: none;
    position: absolute;
    left: 0;
    padding: 0;
    margin: 0;
    margin-top: 3px;
    text-align: left;
    z-index: 999999;
}

.nav li .dropdown-menu.active {
    display: block;

}

.nav li .dropdown-menu a {
    width: 350px;

}


h3 {
    text-decoration: underline;
}
    </style>

  <script>
  window.console = window.console || function(t) {};
</script>



  <script>
  if (document.location.search.match(/type=embed/gi)) {
    window.parent.postMessage("resize", "*");
  }
</script>

</head>
<strong>

<div style="text-align: center;">
    <div style="display: inline-block; text-align: left">

<body translate="no" >

  <ul class="nav">
  <li class="button-dropdown">
  <a rel="nofollow" rel="noreferrer"href="javascript:void(0)" class="dropdown-toggle">
 <span><u>bloomberg</u><font color="#00FF00"> new</font></span></a><ul class="dropdown-menu"><li>
  <?php include 'searchnew.php';?>

<br><br>

  <ul class="nav">
  <li class="button-dropdown">
  <a rel="nofollow" rel="noreferrer"href="javascript:void(0)" class="dropdown-toggle">
 <span><u>coindesk</u><font color="#00FF00"> new</font></span></a><ul class="dropdown-menu"><li>
  <?php include 'searchnew.php';?>  



<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
    <script src="//production-assets.codepen.io/assets/common/stopExecutionOnTimeout-b2a7b3fe212eaa732349046d8416e00a9dec26eb7fd347590fbced3ab38af52e.js"></script>


    <script>
    jQuery(document).ready(function (e) {
    function t(t) {
        e(t).bind("click", function (t) {
            t.preventDefault();
            e(this).parent().fadeOut()
        })
    }
    e(".dropdown-toggle").click(function () {
        var t = e(this).parents(".button-dropdown").children(".dropdown-menu").is(":hidden");
        e(".button-dropdown .dropdown-menu").hide();
        e(".button-dropdown .dropdown-toggle").removeClass("active");
        if (t) {
            e(this).parents(".button-dropdown").children(".dropdown-menu").toggle().parents(".button-dropdown").children(".dropdown-toggle").addClass("active")
        }
    });
    e(document).bind("click", function (t) {
        var n = e(t.target);
        if (!n.parents().hasClass("button-dropdown")) e(".button-dropdown .dropdown-menu").hide();
    });
    e(document).bind("click", function (t) {
        var n = e(t.target);
        if (!n.parents().hasClass("button-dropdown")) e(".button-dropdown .dropdown-toggle").removeClass("active");
    })
});
  //# sourceURL=pen.js
  </script>


</strong>
</head>
</body>
</html>

Answer 1

<!DOCTYPE html>
<html>
<head>
<style>
.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px;`enter code here`
    z-index: 1;
}
.dropdown:hover .dropdown-content {
    display: block;
}
</style>
</head>
<body>

<h2>Hoverable Dropdown</h2>
<p>Move the mouse over the text below to open the dropdown content.</p>

<div class="dropdown">
  <span>Mouse over me 1</span>
  <div class="dropdown-content">
    <ul>
      <li><a href="#">Hello World 1!</a></li> 
      <li><a href="#">Hello World 1!</a></li> 
      <li><a href="#">Hello World 1!</a></li> 
    </ul>
  </div>
</div>

<div class="dropdown">
  <span>Mouse over me 2</span>
  <div class="dropdown-content">
    <ul>
      <li><a href="#">Hello World 2!</a></li> 
      <li><a href="#">Hello World 2!</a></li> 
      <li><a href="#">Hello World 2!</a></li> 
    </ul>
  </div>
</div>

</body>
</html>

带有多个下拉菜单的PHP输入系统

1 个答案: