点击功能的问题

时间:2015-08-12 05:16:50

标签: javascript jquery html css

我的页面左侧有一组按钮。单击这些按钮时,它会显示一个div。我遇到了其中一个按钮的问题。一个名为'公告'。它可能是所有这些问题,但这是我尝试将内容放入的第一个div。我正在尝试添加一个表格。它正在做的是将下一个按钮的内容包含在公告中,反之亦然,对于进行它的按钮。我创建了一个JSfiddle来展示我在做什么。我的页面上的结果是一样的。它显示了这个

<div id='dues'>League Dues</div>

在公告div中。它还会显示我的<th>,但如果您点击公告并尝试重新发布,<th>就会消失。

为什么会这样?

https://jsfiddle.net/s3muwfcg/

完整代码:

<div class="dashboard_selection">
        <div id="dashboard_welcome">Welcome to the Admin Dashboard</div>
        <div id='user_requests'>User Requests</div>
        <div id='message_center'>Message Center</div>
        <div id='edit_rankings'>
            <div class="admin_panel_results_title">Team Rankings</div>
<?php
try {
    //Prepare
     $con = mysqli_connect("localhost", "", "", "");
    if ($stmt = $con->prepare("SELECT * FROM team_rankings WHERE user_id=user_id")) {

        $stmt->execute();
        $stmt->bind_result($ranking_id, $ranking_user_id, $ranking_firstname, $ranking_username, $ranking_division, $ranking_wins, $ranking_losses); 

        //var_dump($stmt);

        if (!$stmt) {
            throw new Exception($con->error);
        }

        $stmt->store_result();
        echo "<span class='top_bottom_margin'>Select a user to modify their team rank</span>". "<br>";
        echo "<select id = 'member'>";
        while ($row = $stmt->fetch()) {
        echo "<option value='{$ranking_username}' data-username='{$ranking_username}'>{$ranking_username}</option>";
        }
        echo "</select>";


    } else {
        echo "<p>There are not any team players yet.</p>";
    }
}
catch (Exception $e)
{
    echo "Error: " . $e->getMessage();
}
?>
                <label>Wins
                    <input type="text" id="wins">
                </label>
                <label>Loss
                    <input type="text" id="losses">
                </label>
            </div>
            <div id='draft_order'>Draft Order</div>
            <div id='draft_input'>Draft Input</div>
            <div id='announcements'>
                Announcements
<?php
$userid = ( isset( $_SESSION['user'] ) ? $_SESSION['user'] : "" );

try {
    //Prepare
     $con = mysqli_connect("localhost", "", "", "");
    if ($announcements_stmt = $con->prepare("SELECT * FROM announcements")) {

        $announcements_stmt->execute();
        $announcements_stmt->bind_result($announcements_id, $announcements_user_id, $announcements_messages, $announcements_date); 

        if (!$announcements_stmt) {
            throw new Exception($con->error);
        }
        $announcements_stmt->store_result();
         $announcements_result = array();

?>
            Current Announcements
            <table>
                <tr>
                    <th>ID</th>
                    <th>Username</th>
                    <th>Message</th>
                    <th>Date</th>
                </tr>   
<?php
        while ($row = $stmt->fetch()) {
?>
                <tr>
                    <td><?php echo $announcements_id; ?></td>
                    <td><?php echo $announcements_username; ?></td>
                    <td><?php echo $announcements_messages; ?></td>
                    <td><?php echo $announcements_date; ?></td>
                </tr>   
            </table>
<?php
        }  
    }
}
    catch (Exception $e)
    {
        echo "Error: " . $e->getMessage();
    }   
?>          
            </div>
            <div id='dues'>League Dues</div>
        </div>

3 个答案:

答案 0 :(得分:0)

您的div未正确关闭

  

请参阅此CLICK HERE

之前关闭一个div
// here 
</div> // <-----
<div id='dues'>League Dues</div>

答案 1 :(得分:0)

试试这个..

<?php
$rss = 'http://headlines.yahoo.co.jp/rss/asahik-dom.xml';
$xml = simplexml_load_file($rss);
var_dump($xml);
?>

Demo

答案 2 :(得分:0)

我检查了你的jsfiddle代码,发现你使用过insertAfter。我已将其替换为html

此外,您还没有关闭公告的div元素,这会导致问题。

检查以下代码。

 jQuery(document).ready(function () {
                     $('.panel_out input').on('click', function(){
                        var id_to_show = '#' + this.id.replace('_button', '');
                        $(id_to_show).show().siblings().hide();
                    }).first().trigger('click');
$("input.arrowBtn").click(function(){
                    $(this).siblings('.arrow-left').remove();
                    $("<div class='arrow-left'></div>").html($(this));
                });
                });

HTML code:

    <div class="panel_out">
        <div class="panel">
            <input type='button' class="panel_buttons arrowBtn" id='user_requests_button' value='User Requests'>
            <input type='button' class="panel_buttons arrowBtn" id='message_center_button' value='Message Center'>
            <input type='button' class="panel_buttons arrowBtn" id='edit_rankings_button' value='Team Rankings'>
            <input type='button' class="panel_buttons arrowBtn" id='draft_order_button' value='Draft Order'>
            <input type='button' class="panel_buttons arrowBtn" id='draft_input_button' value='Draft Input'>
            <input type='button' class="panel_buttons arrowBtn" id='announcements_button' value='Announcements'>
            <input type='button' class="panel_buttons arrowBtn" id='dues_button' value='League Dues'>
        </div>
    </div>
    <div class="dashboard_selection">
        <div id="dashboard_welcome">Welcome to the Admin Dashboard</div>
        <div id='user_requests'>User Requests</div>
        <div id='message_center'>Message Center</div>
        <div id='edit_rankings'>gfg</div>
        <div id='draft_order'>Draft Order</div>
        <div id='draft_input'>Draft Input</div>
        <div id='announcements'>
            Current Announcements
                <table>
                    <tr>
                        <th>ID</th>
                        <th>Username</th>
                        <th>Message</th>
                        <th>Date</th>
                    </tr>
                    <tr>
                        <td><?php echo $announcements_id; ?></td>
                        <td><?php echo $announcements_username; ?></td>
                        <td><?php echo $announcements_messages; ?></td>
                        <td><?php echo $announcements_date; ?></td>
                    </tr>    
                </table>
</div>
        <div id='dues'>League Dues</div>
    </div>