Question

我有一个代码，我想在特定元素之后创建和添加新元素，但是使用javascript或jquery来创建和使用id或其名称。可能吗？

这是代码：

<section class="content " >
            <div class="row ">
                <div class="col-md-6">
                    <div class="grid no-border top bottom black">
                        <div class="grid-header ">
                            <i class="fa fa-align-left"></i>
                            <span class="grid-title">Data Insert Form</span>



                            <div class="pull-right grid-tools">
                                <a data-widget="collapse" title="Collapse"><i class="fa fa-chevron-up"></i></a>
                                <a data-widget="reload" title="Reload"><i class="fa fa-refresh"></i></a>
                                <a data-widget="remove" title="Remove"><i class="fa fa-times"></i></a>
                            </div>
                        </div>
                        <div id="success_message"></div>
                        <div class="grid-body">
                            <?php $data=mysql_fetch_array(mysql_query("select * from admin_seo_meta_tag_data"));?>
                            <form  id="Data-insert" >


                                <div class="form-group">
                                    <label>Page Title</label>
                                    <span style="color:red;" id="Pagetitle_error"></span>
                                    <input type="text" class="form-control" id="PageTitle" name="PageTitle" value="<?php echo $data['PageTitle'];?>" onFocus="clear_Pagetitle()">
                                    <input type="hidden" id="uid" value="<?php echo $_GET['id'];?>">
                                </div>
                                <div class="form-group">
                                    <label>Meta description</label>
                                    <span style="color:red;" id="Metadescription_error"></span>
                                    <input type="text" class="form-control" value="<?php echo $data['MetaDescription'];?>" id="MetaDescription" name="MetaDescription" onFocus="clear_Metadescription()">
                                </div>
                                <div class="form-group">
                                    <label>Meta Keywords</label>
                                    <span style="color:red;" id="Metakeyword_error"></span>
                                    <input type="text" class="form-control" id="MetaKeywords" name="MetaKeywords" value="<?php echo $data['MetaKeywords'];?>" onFocus="clear_Metakeyword()">
                                </div>
                                <div class="form-group">
                                    <label>Location</label>
                                    <span style="color:red;" id="Loc_error"></span>
                                    <input type="text" class="form-control" id="Location" name="Location" value="<?php echo $data['Location'];?>" onFocus="clear_Loc()">
                                </div>


                                <div class="btn-group">
                                    <button type="button" onclick="UpdateSeoData()" class="btn btn-primary">Submit</button>
                                    <button type="text" class="btn btn-default">Cancel</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

        </section>

现在我使用ajax获取成功插入数据，现在我想创建新的div，其中将显示成功消息，我需要动态创建它，因为我正在创建动态inser，更新表单，不知道用户创建的div名称

谢谢大家的帮助终于完成了工作

$('.content-header').append('<div class="success_msg"></div>');
                                                        $('.success_msg').html("<div class='alert alert-success' role='alert' style='font-size: 15px;'><?php echo $message["success"];?></div>");

Answer 1

提问：

我想在特定元素之后创建和添加新元素，但是使用javascript或jquery通过id或其名称添加。有可能吗？

答案是：是的可能

有很多完全不同的方法，但如果我在评论中理解你的解释，那么你需要的是使用这个方法：jQuery.insertAfter

这是一个代码示例，说明如何完成：

＆＃13;

$(function(){
  //Assume yourDiv - is an element that you want to add after element by id="one"
  var yourDiv="<div>Added after #one</div>";
  $(yourDiv).insertAfter("#one");
});

＆＃13;

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
</head>
<body>
	<div id="one">content of ONE</div>
	<div id="two">content of TWO</div>
</body>
</html>

＆＃13;

旁注：jQuery是一个Javascript库，所以即使我理解你的意思：＆＃34; javascript或jquery＆＃34;，但实际上它只是的JavaScript。

OP添加代码示例后添加

修改 ：在看了你的代码示例后，我无法忽略一些事情：

首先 - 不再使用方法mysql_query，mysql_fetch等，如PHP official reference中所述

...在PHP 5.5.0中已弃用，并且已在PHP 7.0.0中删除。相反，应该使用MySQLi或PDO_MySQL扩展......

我建议使用：PDO

第二次 - 直接使用$_GET（或来自客户端的任何其他数据）是UNSAFE。看看：Data validation

......永远不应该信任来自客户的数据......

我建议使用：filter_input并检查（不要听起来偏执但仍然）每个可能的不良情景案例。

Answer 2

    <!DOCTYPE html>
        <head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
        <script>
        $(document).ready(function(){
    function UpdateSeoData(){
         $.ajax({
                type: 'POST',
                url:  file.php,
                dataType: 'json', // data type of response      
                data: JSON,
                contentType:'application/json',
                success: function(data){
                    $('#abcd').append('SuccesFully Insrted');
                },
                error: function(jqXHR, textStatus, errorThrown){
                handleErrors('Error: ' , textStatus , errorThrown);
                }


            });

    }     
        })
        </script>
        </head>
        <body>
        <div id="abcd"></div>
        </body>
        </html>

可以使用javascript或jquery创建和添加新元素吗？

2 个答案: