如何获取由php脚本动态生成的div值?

时间:2017-11-13 07:57:14

标签: javascript php jquery html

我想提醒我将点击其地点出价按钮的项目的名称,但我的代码似乎只提醒笔记本电脑。任何人都可以告诉我如何获得通过PHP脚本动态生成的div值。下面是该页面的代码。我想提醒我点击其出价的项目的名称。由于页面是动态生成的,它从包含项目详细信息的数据库中获取项目详细信息。



<?php
	$con = mysqli_connect("localhost","root","*****","bidding") or
	die(mysqli_error($con));
	$select_query = "select * from items";
	$select_query_result = mysqli_query($con, $select_query) or
	die("Query Mistake");
?>
<!DOCTYPE html>
<html>
<head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Bid</title>
        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
        <link rel="stylesheet" href="materialize/css/materialize.css"/>
        <link rel="stylesheet" type="text/css" href="seperate2.css">
        <script src="jquery-3.2.1.min.js"></script>
        <script src="materialize/js/materialize.min.js"></script>
        <script type="text/javascript">
        function post_data(){
        	var item_name = document.getElementById("item_name").innerHTML;
        	alert(item_name);
        }
        </script>
</head>
<body>
	<div class="container">
		<h1>Bid</h1>
		<div class="row">
			<?php while($row = mysqli_fetch_array($select_query_result)) { ?>
			<div class="col s3" >
				<div id="item_name"><?php echo"$row[item_name]"?></div>
				<div id="starting_price"><?php echo"$row[starting_price]"?</div>
				<div><?php echo"$row[description]"?></div>
				<button class="btn waves-effect waves-teal" 
                 onclick="post_data()">Place Bid</button>
			</div>
		    <?php } ?>
		</div>
	</div>
</body>
</html>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

HTML中元素的ID必须是唯一的。使用课程。 在循环中,您声明ID的静态名称,它不是唯一的。

答案 1 :(得分:0)

您的代码需要一个计数器,通过该计数器可以访问动态创建的DIV。您的<div class="row">阻止将是:

    <div class="row">
        <?php
        $divCounter = 0; 
        while($row = mysqli_fetch_array($select_query_result)) { 
        $divCounter += 1;
        ?>
        <div class="col s3" >
            <div id="item_name<?php echo $divCounter; ?>"><?php echo"$row[item_name]"?></div>
            <div id="starting_price"><?php echo"$row[starting_price]"?</div>
            <div><?php echo"$row[description]"?></div>
            <button class="btn waves-effect waves-teal" 
             onclick="post_data('<?php echo 'item_name'.$divCounter; ?>')">Place Bid</button>
        </div>
        <?php } ?>
    </div>

请注意,对Javascript函数post_data()的调用现在提供包含其计数器的DIV ID。要完成此作业,请调整post_data()以包含参数:

    <script type="text/javascript">
    function post_data(divId){
        var item_name = document.getElementById(divId).innerHTML;
        alert(item_name);
    }
    </script>

如果您愿意,可以使用$row[item_name]属性,而不是使用计数器并与静态“item_name”连接。是否可以执行此操作取决于此属性是否可用作有效的HTML id属性值。