个人中心
gpt4 book ai didi

php - 当页面加载到 div 中时，让 jQuery 的函数运行

转载 作者：行者123 更新时间：2023-11-30 10:55:04 24 4
gpt4 key购买 nike

我有一个网站，用户可以在该网站上登录并检查他们向我们提出的 Unresolved 支持问题，该网站上有一个用于管理每个公司联系人的页面。在更新网站的同时，我已经开始使用 jQuery 加载子页面，这样用户就不会每次都刷新页面。当该子页面加载到 div 中时，我开始遇到加载 JavaScript 的问题。

过程如下:
用户点击设置链接，加载settings.php(整个页面刷新)
用户点击“管理联系人”选项，将 managecontacts.php 加载到 div#settingsph
从选择框中，用户选择他们希望更新的联系人，这会将用户数据加载到 div#contact_info(在选择框下方)，使用选项的值作为联系人 ID 传递给 editcontact.php，后者查询db 并将其呈现为用于更改的表单。

加载此页面后，我打算使用 jQuery 验证和 ajax 函数提交表单，而无需再次刷新页面。但是，此时我似乎无法加载 Javascript。我尝试在主页中将 Javascript 作为文件引用 <head>标记，作为 <head> 中的脚本标记，作为 editcontact.php 中的文件和 editcontact.php 中的脚本，但这些似乎都没有加载脚本来隐藏我的错误标签，或提交更新。

代码:editcontact.php

<?php
session_start();

require  '../dbsettings.php';

header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header ("Cache-Control: no-cache, must-revalidate");
header ("Pragma: no-cache");
header("content-type: application/x-javascript; charset=tis-620");
?>
<?php
$id = $_GET['id'];
if($id!=''){
    if($id!='NewContact'){ //if valid id has been supplied for db retrieval
        try
        {
            $db = new PDO('mssql:host=' . DBHOST . ';dbname=' . DBDATA, DBUSER, DBPASS);
        }
        catch(PDOException $error)
        {
            echo "<h2>Error!  " . $error->getmessage()."</h2>";
            die();
        }

        $query = "  SELECT ContactID, Surname, Forename, Phone, Email, JobTitle, MobileNumber, LeaveDate 
                    FROM Contact 
                    WHERE CompanyID ='" . $_SESSION['companyid'] . "' AND ContactID='" . $id . "'
                    ORDER BY Forename ASC";

        foreach($db->query($query) as $contact)
        {
?>
            <!--Have tried putting the script between <script> tags here-->
            <div id="contact_update">
                <form>
                    <h3>Personal Information</h3>
                    <label for="forename">Forename(s):</label>
                    <input name="forename" id="forename" value="<?php echo $contact['Forename']; ?>" class="text-input" />
                    <label class="error" for="forename" id="forename_error">Forename is required.</label>
                    <br />
                    <label for="surname">Surname:</label>
                    <input name="surname" id="surname" value="<?php echo $contact['Surname']; ?>" class="text-input" />
                    <label class="error" for="surname" id="surname_error">Surname is required.</label>
                    <br />
                    <label for="jobtitle">Job Title:</label>
                    <input name="jobtitle" id="jobtitle" value="<?php echo $contact['JobTitle']; ?>" class="text-input" />

                    <br />
                    <h3>Contact Information</h3>
                    <label for="phone">Telephone: </label>
                    <input name="phone" id="phone" value="<?php echo $contact['Phone']; ?>" class="text-input" />
                    <label class="error" for="phone" id="phone_error">Telephone is required.</label>
                    <br />
                    <label for="mob">Mobile: </label>
                    <input name="mob" id="mob" value="<?php echo $contact['MobileNumber']; ?>" class="text-input" />

                    <br />
                    <label for="email">Email:</label>
                    <input name="email" id="email" value="<?php echo $contact['Email']; ?>" class="text-input" />
                    <label class="error" for="email" id="email_error">Email is required.</label>
                    <br />
                    <h3>Misc Information</h3>
                    <label for="ldate">Leave Date:</label>
                    <input name="ldate" id="ldate" value="<?php echo $contact['LeaveDate']; ?>" class="text-input" />
                    <label for="ldate" class="hint">* Leave blank if still an active user</label>

                    <br />
                    <input type="submit" name="submit" value="Update" class="button" id="update_button" />
                </form>
            </div>
<?php
        } //end of foreach

    }else{ //else a new contact is being added
?>      
            <div id="contact_add">
                <form>
                    <h3>Personal Information</h3>
                    <label for="forename">Forename(s):</label><input name="forename" id="forename" /><br />
                    <label for="surname">Surname:</label><input name="surname" id="surname" /><br />
                    <label for="jobtitle">Job Title:</label><input name="jobtitle" id="jobtitle" /><br />
                    <h3>Contact Information</h3>
                    <label for="phone">Telephone: </label><input name="phone" id="phone" /><br />
                    <label for="mob">Mobile: </label><input name="mob" id="mob" /><br />
                    <label for="email">Email:</label><input name="email" id="email" /><br />
                    <input type="submit" value="Update" />
                </form>
            </div>
<?php
    }
}else{ //else page was not generated with id, possibly not using javascript - die, without allowing access
    echo 'ERROR 403 - FORBIDDEN';
    die();
}
?>

代码:jquery.settings.js

// JavaScript Document

$(function managecontacts() {
  $('.error').hide();
  $('input.text-input').css({backgroundColor:"#ffffe0"});
  $('input.text-input').focus(function(){
    $(this).css({backgroundColor:"#FFFFFF"});
  });
  $('input.text-input').blur(function(){
    $(this).css({backgroundColor:"#ffffe0"});
  });

  $(".button").click(function() {
        // validate and process form
        // first hide any error messages
    $('.error').hide();

        var forename = $("input#forename").val();
        if (forename == "") {
      $("label#forename_error").show();
      $("input#forename").focus();
      return false;
    }

        var surname = $("input#surname").val();
        if (surname == "") {
      $("label#surname_error").show();
      $("input#surname").focus();
      return false;
    }
        var email = $("input#email").val();
        if (email == "") {
      $("label#email_error").show();
      $("input#email").focus();
      return false;
    }
        var phone = $("input#phone").val();
        if (phone == "") {
      $("label#phone_error").show();
      $("input#phone").focus();
      return false;
    }

        var jobtitle = $("input#jobtitle").val();
        var mobile = $("input#mob").val();
        var ldate = $("input#ldate").val();

        var dataString = 'forename=' + forename + '&surname=' + surname + '&jobtitle=' + jobtitle '&email=' + email + '&phone=' + phone + '&mobile=' + mobile + '&ldate=' + ldate;
        //alert (dataString);return false;

        $.ajax({
      type: "POST",
      url: "Includes/stg/contactprocess.php",
      data: dataString,
      success: function() {
        $('#contact_update').html("<div id='message'></div>");
        $('#message').html("<h2>Contact Successfully Updated</h2>")
        .append("<p>Thank you.</p>")
        .hide()
        .fadeIn(1500, function() {
          $('#message').append("<img id='checkmark' src='images/tick.png' />");
        });
      }
     });
    return false;
    });
});

代码:<head>用于将页面加载到 div 中的标记

<script type="text/javascript">
    function open_page(name) {
        $("#settingsph").load("Includes/stg/"+name+".php");
    }
    function open_contact(id) {
        $("#contact_info").load("includes/stg/editcontact.php?id="+id);
    }
</script>

如果能就这是否可行，或者我是否需要回到绘图板提供任何帮助，我们将不胜感激。

最佳答案

Laimoncijus 提供了有关使用回调运行脚本的答案。但您也可以使用 jQuery 的 live 来完成此操作事件功能自动将事件函数添加到文档准备好后添加的元素。而且易于实现。

改变

$(".button").click(function() {

到

$(".button").live('click', function() {

这也适用于您的 focus 和 blur 事件。

关于php - 当页面加载到 div 中时，让 jQuery 的函数运行，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2363020/

24 4 0
文章推荐： javascript - 使用 JQuery 查找和复制图像
文章推荐： javascript - jquery.blur() 不在 alert() 中
文章推荐： php - 在javascript中访问PHP变量
文章推荐： java - SocketChannel 和 FileChannel.transferFrom/To
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com