我不是HTML / CSS的新手，但我绝对使用PHP，并且无法弄清楚如何收集表单值并在textarea中显示它们。我已经研究了至少30个站点，并且在这里和那里找到了可以做我想要的代码。我只是不知道如何把它们放在一起并让它发挥作用。
此个人项目的要求如下：
收集客户名称，域名或客户编号，电话号码输入值，任何选中的值，客户问题中的任何值，客户需求以及购买/续订textareas，然后在备注文本区域中显示所有这些值。显示的每个值应该有一个空格，一个短划线，另一个空格“ - ”连接到除最后一个值之外的所有值的末尾，最后一个值应该以句点结束。
捕获按钮应收集所有值并发送到PHP处理以显示在注释textarea中。复制按钮（显然）将复制音符textarea中的值，并显示1到2秒的消息，说明“已复制音符”。清除按钮（显然，再次）清除表单。我将是唯一的用户，因此不需要验证。
我不希望任何人为我做所有的工作，但我真的很挣扎，我会非常感谢提示，指示和质量参考网站。
我整理的网站代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="../../assets/ico/favicon.png">
<title>One Pass Call</title>
<link href="./bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">
<link href="./includes/js/bxslider/jquery.bxslider.css" rel="stylesheet">
<link href="./includes/themes/default/style.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="./includes/js/html5shiv.js"></script>
<script src="./includes/js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top visible-xs">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="./">ONE PASS <span class="strap">CALL</span></a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li class="selected">
<a href="#">Home</a>
</li>
<li>
<a href="#customer-experience"><i class="icon-phone icon-1x"></i> Customer Experience</a>
</li>
<li>
<a href="#consultation"><i class="icon-comments icon-1x"></i> Consultation</a>
</li>
<li>
<a href="#consultation-details"><i class="icon-puzzle-piece icon-1x"></i> Consultation Details</a>
</li>
<li>
<a href="#offer-and-close"><i class="icon-credit-card icon-1x"></i> Offer and Close</a>
</li>
<li>
<a href="#notes"><i class="icon-keyboard icon-1x"></i> Notes</a>
</li>
</ul>
</div>
</div>
</div>
<ul id="sidemenu" class="sidemenu hidden-xs">
<li>
<a class="sidemenu-brand" href="#">ONE PASS CALL</a>
</li>
<li>
<a class="selected" href="index.html"><i class="fa fa-home icon-2x"></i> <br/>Home</a>
</li>
<li>
<a href="#customer-experience"><i class="fa fa-phone icon-2x"></i> <br/>Customer Experience</a>
</li>
<li>
<a href="#consultation"><i class="fa fa-comments icon-2x"></i> <br/>Consultation</a>
</li>
<li>
<a href="#consultation-details"><i class="fa fa-puzzle-piece icon-2x"></i> <br/>Consultation Details</a>
</li>
<li>
<a href="#offer-and-close"><i class="fa fa-credit-card icon-2x"></i> <br/>Offer and Close</a>
</li>
<li>
<a href="#notes"><i class="fa fa-keyboard-o icon-2x"></i> <br/>Notes</a>
</li>
</ul>
<div class="content-area">
<div class="container">
<div class="row">
<div class="col-sm-12">
<img src="./includes/img/gd-header-reg.jpg" class="pull-right img-responsive" alt="" />
</div>
</div>
</div>
<h1 class="text-center">
A Recipe for Success on Every Call!
</h1>
<hr/>
<div id="features">
<div class="container">
<div class="row feature">
<div class="col-sm-12">
<a name="customer-experience"></a>
<h1 class="gd-orange">Customer Experience</h1>
<br />
<form class="form-horizontal" role="form" method="post" action="customer.php" novalidate autocomplete="off">
<ul>
<li>
<h2>
Did the agent properly greet the customer and confirm the call back number?
</h2>
<br />
<ul>
<li>
<p>Sales and Support, this is (your name). Who am I speaking with today?</p>
<div class="form-group col-sm-12">
<label class="control-label" for="name"><strong>Customer's Name:</strong></label>
<div class="input-group"><span class="input-group-addon left"><i class="fa fa-user"></i> </span>
<input type="text" class="form-control" id="name" name="name" value="" placeholder="Customer's name..." />
</div>
</div>
</li>
<li>
<p>Hi (customer's name), do you have your domain or customer number available to verify?</p>
<div class="form-group col-sm-12">
<label class="control-label" for="account"><strong>Domain or Customer Number:</strong></label>
<div class="input-group"><span class="input-group-addon left"><i class="fa fa-globe"></i> </span>
<input type="text" class="form-control" id="account" name="account" value="" placeholder="Domain/Account#..." />
</div>
</div>
</li>
<li>
<p>Thank you, and is this a good number to call you at if we get disconnected?</p>
<div class="form-group col-sm-12">
<label for="phone" class="control-label"><strong>Phone Number:</strong></label>
<div class="input-group"><span class="input-group-addon left"><i class="fa fa-phone"></i> </span>
<input type="text" class="form-control" id="phone" name="phone" value="" placeholder="Phone number..." />
</div>
</div>
</li>
</ul>
</li>
</ul>
<br />
<hr class="visible-lg" />
<br />
<ul>
<li>
<h2>
Did the agent build rapport and deliver a good experience for the customer?
</h2>
<br />
<ul>
<li>
<p>How is your day going so far?</p>
</li>
<li>
<p>Great! Can you briefly let me know how I can help you today?</p>
</li>
</ul>
</li>
</ul>
<br />
<hr class="visible-lg" />
<br />
<ul>
<li>
<h2>
Did the agent actively listen to the customer and clarify their concern?
</h2>
<br />
<ul>
<li>
<p>Ok, can you be a little more specific for me?</p>
</li>
<li>
<p>So to restate what I'm hearing... does that sound right?</p>
</li>
<li>
<p>Well ok, let's get you all fixed up!</p>
<div class="form-group">
<div class="col-md-12"><label class="control-label"><strong>Customer's Issue:</strong></label></div>
<div class="col-md-3">
<div class="checkbox">
<input id="issue1" name="checkIssue[]" type="checkbox" value="GD Password Reset" >
<label for="issue1">GD Password Reset</label>
</div>
<div class="checkbox">
<input id="issue2" name="checkIssue[]" type="checkbox" value="WSE Password Reset" >
<label for="issue2">WSE Password Reset</label>
</div>
<div class="checkbox">
<input id="issue3" name="checkIssue[]" type="checkbox" value="O365 Password Reset" >
<label for="issue3">O365 Password Reset</label>
</div>
</div>
<div class="col-md-3">
<div class="checkbox">
<input id="issue4" name="checkIssue[]" type="checkbox" value="Android Setup" >
<label for="issue4">Android Setup</label>
</div>
<div class="checkbox">
<input id="issue5" name="checkIssue[]" type="checkbox" value="iPhone/iPad Setup" >
<label for="issue5">iPhone/iPad Setup</label>
</div>
<div class="checkbox">
<input id="issue6" name="checkIssue[]" type="checkbox" value="Outlook Setup" >
<label for="issue6">Outlook Setup</label>
</div>
</div>
<div class="col-md-3">
<div class="checkbox">
<input id="issue7" name="checkIssue[]" type="checkbox" value="Apple/Mac Mail Setup" >
<label for="issue7">Apple/Mac Mail Setup</label>
</div>
<div class="checkbox">
<input id="issue8" name="checkIssue[]" type="checkbox" value="Alias Setup" >
<label for="issue8">Alias Setup</label>
</div>
<div class="checkbox">
<input id="issue9" name="checkIssue[]" type="checkbox" value="Forwarding Setup" >
<label for="issue9">Forwarding Setup</label>
</div>
</div>
<div class="col-md-3">
<div class="checkbox">
<input id="issue10" name="checkIssue[]" type="checkbox" value="Migration Issue" >
<label for="issue10">Migration Issue</label>
</div>
<div class="checkbox">
<input id="issue11" name="checkIssue[]" type="checkbox" value="Known Issue" >
<label for="issue11">Known Issue</label>
</div>
<div class="checkbox">
<input id="issue12" name="checkIssue[]" type="checkbox" value="Out of Scope" >
<label for="issue12">Out of Scope</label>
</div>
</div>
</div>
</li>
</ul>
</li>
</ul>
<div class="form-group col-sm-12">
<label class="control-label" for="details"></label>
<div class="input-group"><span class="input-group-addon left"><i class="fa fa-warning"></i> </span>
<textarea class="form-control" id="details" name="details" rows="5" placeholder="Customer's issue..." /></textarea>
</div>
</div>
<br />
<hr class="visible-lg" />
<br />
<ul>
<li>
<h2>
Did the agent set proper expectations?
</h2>
<br />
<ul>
<li>
<p>First off I want to set some expectations as to what I'll be doing for you, ok?</p>
</li>
<li>
<p>I'm going to be working with you to take care of the problem.</p>
</li>
<li>
<p>I'll ask you questions along the way to determine how to best resolve the problem.</p>
</li>
<li>
<p>If possible, please keep answers simple so we're not stuck working on this for a long time.</p>
</li>
<li>
<p>The large page titles and bolded headings work fine if I need to ask what page you are looking at, ok?</p>
</li>
<li>
<p>Now, if the issue falls outside our scope of support I'll do what I can to point you in the right direction, ok?</p>
</li>
</ul>
</li>
</ul>
<br />
<hr class="visible-lg" />
<br />
<a name="consultation"></a>
<h1 class="gd-orange">Consultation</h1>
<br />
<ul>
<li>
<h2>
Did the agent engage the customer in a needs based conversation which led to a personalized recommendation?
</h2>
<br />
<ul>
<li>
<p>First I want to know your comfort level with computers. Are you a neophyte, semi-confident, pretty confident or a seasoned pro when it comes to computers?</p>
</li>
<li>
<p>Ok (customer name), as I run tests and troubleshoot I'll review the account to make sure everything is in good standing.</p>
</li>
<li>
<p>While I'm doing that can I ask some questions about your business to see if we have other services that can help grow your business?</p>
</li>
</ul>
</li>
</ul>
<br />
<hr class="visible-lg" />
<br />
<a name="consultation-details"></a>
<h1 class="gd-orange">Consultation Details</h1>
<br />
<ul>
<li>
<h2>
Did the agent ask questions to uncover or understand the customer's need?
</h2>
<br />
<ul>
<li>
<p>Since we're on the subject of email, is there anything about your email service that isn't meeting your needs? Ok, please tell me more...</p>
</li>
<li>
<p>Tell me about your website. Is there anything it isn't doing for you that you wish it was?</p>
</li>
<li>
<p>Do you ever wonder why you don't get better search rankings or more traffic to your website?</p>
</li>
<li>
<p>How happy are you with your current website hosting service? Are you unhappy enough with it to consider bringing your website to GoDaddy?</p>
</li>
<li>
<p>How would you feel about having all your internet services in one account, with one company, instead having things spread amongst several companies?</p>
</li>
</ul>
</li>
</ul>
<div class="form-group col-sm-12">
<label class="control-label" for="needs"><strong>Customer Needs:</strong></label>
<div class="input-group"><span class="input-group-addon left"><i class="fa fa-comments"></i> </span>
<textarea class="form-control" id="needs" name="needs" rows="5" col="1" placeholder="Customer needs..." /></textarea>
</div>
</div>
<br />
<hr class="visible-lg" />
<br />
<ul>
<li>
<h2>
Did the agent make a personalized recommendation based on the customer's unique journey?
</h2>
<br />
<ul>
<li>
<p>Well (customer's name), based on what you've told me I'd have to say that (product/s) will be a perfect solution for you.</p>
</li>
</ul>
</li>
</ul>
<br />
<hr class="visible-lg" />
<br />
<ul>
<li>
<h2>
Did the agent miss any opportunities on the call?
</h2>
<br />
<ul>
<li>
<p>One thing I noticed is you don't have your website secured... has anyone here ever pointed this out to you?</p>
</li>
<li>
<p>Your billing dates for your products are scattered all over. Would having everything on the same billing cycle be convenient for you?</p>
</li>
<li>
<p>Would you like me to delete the expired credit cards on the account?</p>
</li>
</ul>
</li>
</ul>
<br />
<hr class="visible-lg" />
<br />
<a name="offer-and-close"></a>
<h1 class="gd-orange">Offer and Close</h1>
<br />
<ul>
<li>
<h2>
Did the agent close the sale based on the recommendation?
</h2>
<br />
<ul>
<li>
<p>Ok, sounds like we have the perfect package put together for you.</p>
</li>
<li>
<p>Would you like to go with the 5 year option for the best discounts? Or would you prefer to go with a 3 year option.</p>
</li>
<li>
<p>Great, let's go ahead and get you checked out. Would you like to use the credit card ending in (xxxx), or a different credit card?</p>
</li>
</ul>
</li>
</ul>
<div class="form-group col-sm-12">
<label class="control-label" for="transaction"><strong>Purchase/Renewal:</strong></label>
<div class="input-group"><span class="input-group-addon left"><i class="fa fa-shopping-cart"></i> </span>
<textarea class="form-control" id="transaction" name="transaction" rows="5" col="1" placeholder="Customer purchased/renewed... " /></textarea>
</div>
</div>
<br />
<hr class="visible-lg" />
<br />
<ul>
<li>
<h2>
Did the agent attempt to overcome objections?
</h2>
<br />
<ul>
<li>
<p>Ok, I can see where you're coming from. So far we've agreed the (product/s) we talked about will definitely benefit you.</p>
</li>
<li>
<p>Is there anything I didn't explain properly which is keeping you from moving forward? Or maybe you have more questions?</p>
</li>
<li>
<p>I understand you're not the decision maker for the account. Can I send you an email so you can follow up with me once you speak with your manager?</p>
</li>
</ul>
</li>
</ul>
<br />
<hr class="visible-lg" />
<br />
<ul>
<li>
<h2>
Did the agent offer to set up the products and provide next steps?
</h2>
<br />
<ul>
<li>
<p>Once we finish with the purchase I'll help you set everything up and make sure everything is running smoothly.</p>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<div class="row">
<div class="col-sm-12">
<a name="notes"></a>
<h1 class="gd-orange">Notes</h1>
<h3 class="justify" style="text-align: center">Copy and paste your notes.</h3>
<div class="form-group">
<label class="control-label" for="notes"></label>
<div class="input-group"><span class="input-group-addon left"><i class="fa fa-book"></i> </span>
<textarea class="form-control" id="notes" name="notes" rows="18" placeholder="These are your notes..." ></textarea>
</div>
</div>
<div class="form-group submit col-sm-12">
<label class="control-label sr-only" for="notes" style="display: block;">Submit Button</label>
<div class="progress" style="display: none; z-index: -1; position: absolute;">
<div class="progress-bar progress-bar-striped active" role="progressbar" style="width:100%"></div>
</div>
<button type="submit" class="btn btn-default btn-footer" name="capture" value="">Capture</button>
<button type="submit" class="btn btn-default btn-footer" name="copy" value="">Copy</button>
<button type="reset" class="btn btn-default btn-footer" name="clear" value="">Clear</button>
</div>
</form>
</div>
</div>
<div class="container jf-thankyou" style="display:none;" data-redirect="" data-seconds="1">
<h3>Your notes have been copied!</h3>
</div>
</div>
</footer>
<div id="footer-bottom">
© 2016 Johnny Marrero. All rights reserved.
</div>
</div>
<script src="./includes/js/jquery-2.0.3.min.js"></script>
<script src="./bootstrap/js/bootstrap.min.js"></script>
<script src="./includes/js/jquery.event.move.js"></script>
<script src="./includes/js/jquery.event.swipe.js"></script>
<script src="./includes/js/default.js"></script>
</body>
</html>
答案 0 :(得分：0)
您需要了解http服务器中的请求和响应过程，并在html中表单提交过程。按照以下步骤操作。
1.首先将所有表单字段（如输入，文本区域，复选框）放在html html / php文件中的表单标记中，如下所示
<form **action="welcome.php"** method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input **type="submit"** value="Submit">
</form>
从html表单接收数据的典型php文件如下所示。
<html>
<body>
Welcome <?php echo $_POST["fname"]." ".$_POST["lname"]; ?><br>
</body>
</html>
http://www.w3schools.com/php/php_forms.asp - 链接以获取更多基本信息