Fatal编程技术网
  • php/
  • 带有多个下拉菜单的PHP输入系统'；s

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

php html drop-down-menu

带有多个下拉菜单的PHP输入系统'；s,php,html,drop-down-menu,Php,Html,Drop Down Menu,我有一个Php输入系统，有5个字段：数字、链接、文章、名称和日期。我正在尝试将信息放入两个不同的下拉菜单中。例如，在数据库中，我有： 1…….http链接…….彭博链接…….彭博…2017-03-22 2............................http链接................福布斯链接 所以，我需要彭博名下的文章进入彭博下拉菜单，而福布斯名下的文章进入福布斯下拉菜单 目前，我在页面上有两个下拉菜单，彭博社和福布斯的文章都进入了这两个菜单，因为我不知道如何让它们进入正确

我有一个Php输入系统，有5个字段：数字、链接、文章、名称和日期。我正在尝试将信息放入两个不同的下拉菜单中。例如，在数据库中，我有：

1…….http链接…….彭博链接…….彭博…2017-03-22 2............................http链接................福布斯链接

所以，我需要彭博名下的文章进入彭博下拉菜单，而福布斯名下的文章进入福布斯下拉菜单

目前，我在页面上有两个下拉菜单，彭博社和福布斯的文章都进入了这两个菜单，因为我不知道如何让它们进入正确的下拉菜单。这一页是

如果有人能给我看代码，让彭博社的文章进入彭博社的下拉菜单，让福布斯的文章进入福布斯的下拉菜单，我将不胜感激。下面是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>


树篱
李{
线高：1.10；
}
@字体{
字体系列：MesloLGL-Regular；
src:url（/MesloLGL Regular.ttf）；
}
跨度*
{
字体大小：12px！重要；
}
正文*{
背景：黑色；
字体系列：MesloLGL Regular！重要；
字体大小：12px！重要；
}
身体{
背景色：#000；
文本对齐：居中；
填充顶部：50px；
}
.导航{
显示：块；
保证金：0；
填充：0；
}
李国荣先生{
显示：内联块；
列表样式：无；
}
.导航按钮下拉列表{
位置：相对位置；
}
李娜先生{
显示：块；
颜色：#fff；
背景色：#000；
填充：0px 20px；
文字装饰：无；
}
李海军{
显示：内联块；
左边距：5px；
字体大小：10px；
颜色：#FFF；
}
.nav li a:悬停，.nav li a.下拉切换.active{
背景色：#000；
颜色：#fff；
}
.nav li a:悬停范围，.nav li a.下拉切换.活动范围{
颜色：#fff；
}
.nav li.下拉菜单{
显示：无；
位置：绝对位置；
左：0；
填充：0；
保证金：0；
利润上限：3倍；
文本对齐：左对齐；
z指数：999999；
}
.nav li.下拉菜单.激活{
显示：块；
}
.nav li.下拉菜单a{
宽度：350px；
}
h3{
文字装饰：下划线；
}
window.console=window.console | |函数（t）{}；
if（document.location.search.match（/type=embed/gi））{
window.parent.postMessage（“resize”、“*”）；
}


    

  • 

    • 


      

        

      • 

        • 
jQuery（文档）.ready（函数（e）{
函数t（t）{
绑定（“点击”，函数（t）{
t、 预防默认值（）；
e（this.parent（）.fadeOut（））
})
}
e（“下拉切换”）。单击（函数（）{
var t=e（this）.parents（“.button dropdown”）.children（.dropdown menu”）.is（“：hidden”）；
e（“.button dropdown.dropdown menu”）.hide（）；
e（“.button dropdown.dropdown toggle”）.removeClass（“活动”）；
if（t）{
e（this）.parents（“.button dropdown”）.children（“.dropdown menu”）.toggle（）.parents（“.button dropdown”）.children（.dropdown toggle”）.addClass（“活动”）
}
});
e（文件）。绑定（“点击”，功能（t）{
var n=e（t.目标）；
如果（！n.parents（）.hasClass（“按钮下拉菜单”））e（“.button下拉菜单”）.hide（）；
});
e（文件）。绑定（“点击”，功能（t）{
var n=e（t.目标）；
如果（！n.parents（）.hasClass（“按钮下拉”））e（“.button dropdown.dropdown切换”）.removeClass（“活动”）；
})
});
//#sourceURL=pen.js



.下拉列表{
位置：相对位置；
显示：内联块；
}
.下拉内容{
显示：无；
位置：绝对位置；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
padding:12px 16px；`在这里输入代码`
z指数：1；
}
.下拉：悬停.下拉内容{
显示：块；
}
悬停式下拉菜单
将鼠标移到下面的文本上以打开下拉内容

鼠标在我身上1

    

  • 

  • 

  • 


鼠标在我身上2

    

  • 

  • 

  •
您应该首先尝试将css、js、php、html分离到不同的文件中。然后你应该考虑为每个类别做两个查询，或者使用php和if语句将它们分开，你建议哪一个更容易？根据你的代码，最简单的解决方案是创建两个php文件，一个用于彭博社，另一个用于福布斯，使查询只搜索这些文件，然后你就完成了。但这是一种糟糕的做法。相反，不要简单地包含仅包含ul的文件。相反，请考虑通过php为下拉列表创建整个html标记，这样您将更加灵活。是的，不幸的是，我不知道如何编写您建议的代码。Thanksi写了两种不同的方法。我对他们两人的描述都是毫无根据的。你应该能够成功；）谢谢，但这与我要做的并不相关。哦，那很好，然后尝试使用where条件创建不同的sql查询。哦，那很好，然后尝试使用where条件创建不同的sql查询$sql1=“SELECT*FROM crypto where columns='name'ORDER BY Date DESC，Number DESC”；php代码中的sql语句、sql、sql1等如何进入正确的下拉菜单？例如，sql语句应将彭博链接带到彭博下拉菜单中，sql1语句应将福布斯链接带到福布斯下拉菜单中。谢谢 
<!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>