jQuery Javascript组合列表

我正在尝试创建一个表单,其中我可以有一个列表和一个输入框/文本框。 我想要的是当用户在文本框中键入一个值并单击添加到列表时,该值应该添加到列表中。 然后,当该人按下提交时,PHP代码应该能够使用从列表中获取的值来执行过程。 我试图用PHP和HTML来做,但有一些人在JS中提出了jQuery。 请帮助你了解你所知道的或如何做到这一点。</ p>

如果你不明白我有一张关于我想做的事情的图表...... </ p>

< p> </ p>

 &lt;?php

$ Fname = $ _POST [“Fname”];

if(!isset($ _ POST ['submit'])){//如果页面未提交给自身,则回显表单
?&gt; ;

&lt; html&gt;
&lt; head&gt;
&lt; title&gt;个人信息&lt; / title&gt;

&lt; style type =“text / css”&gt;
body {
background-image:url(“http://dev.icalapp.rogersdigitalmedia.com.rogers-test.com/rogers_blackberry_8900.jpg”);
background-position:50%50%;
background-repeat :repeat;
}
&lt; / style&gt;

&lt; / head&gt;

&lt; body&gt;
&lt; form method =“post” action =“&lt;?php echo $ PHP_SELF;?&gt;”&gt;

&lt; span style =“font-family:Helvetica; font-size:22px; font-style:normal; font - 重量:大胆;文字修饰:强调;文本转换: 大写;颜色:FFFFFF;背景颜色:990033;“&gt;数量的数量&lt; / span&gt; &lt; input type =“text”style =“text-align:center”size =“12”maxlength =“50”name =“Fname”&gt;&lt; br /&gt;

&lt;输入类型 =“submit”value =“submit”name =“submit”&gt;
&lt; / form&gt;
&lt;?
}

?&gt;
</ code> </ pre>
</ DIV>

展开原文

原文

I am trying to create a form in which I can have a list and an input box/text box. What I want is when a user types in the text box a value and clicks add to the list, the value should be added to the list. Then once the person presses submit, the PHP code should be able to use the values obtained from list for procedure. I am trying to do it in PHP and HTML but a few have suggested jQuery in JS. Please help with what you know or how I can do this.

If you dont understand I have a diagram for what I want to do...

enter image description here

<?php
    $Fname = $_POST["Fname"];


    if (!isset($_POST['submit'])) { // if page is not submitted to itself echo the form
    ?>


    <html>
    <head>
    <title>Personal INFO</title>


    <style type="text/css">
      body {
      background-image: url("http://dev.icalapp.rogersdigitalmedia.com.rogers-test.com/rogers_blackberry_8900.jpg");
      background-position: 50% 50%;
      background-repeat: repeat;
    }
    </style>



    </head>




    <body>
    <form method="post" action="<?php echo $PHP_SELF;?>">



    <span style="font-family:Helvetica;font-size:22px;font-style:normal;font-weight:bold;text-decoration:underline;text-transform:capitalize;color:FFFFFF;background-color:990033;">Amount of Numbers</span> <input type="text" style="text-align:center" size="12" maxlength="50" name="Fname" ><br />


    <input type="submit" value="submit" name="submit">
    </form>
    <?
    } 

    ?>

doucuoyan0426
doucuoyan0426 一分钟做小提琴
9 年多之前 回复

2个回答



尝试这样的事情:</ p>

JS:</ p>

  $('#add')。click(function(){

var input = $('#addInput');
var display = $('#display');
var form = $('#addForm');

if($。trim(input.val())。length&gt; 0){//有输入吗?
display.append($('&lt; p&gt; ;',{text:input.val()}));
form.append($('&lt; input&gt;',{value:input.val(),type:'hidden',name:'added [ ]'}));
input.val('');
}

})
</ code> </ pre>

HTML:</ p>

&lt; input id =“addInput”/&gt; &lt; button id =“add”&gt;添加&lt; / button&gt;

&lt; div id ='display'&gt;&lt; / div&gt;

&lt; form action =“something.php”id =“addForm “&gt;
&lt; input type =”submit“value =”SUBMIT“/&gt;
&lt; / form&gt;
</ code> </ pre>

然后所有的事情 你应该添加一个名为 $ _ POST ['added'] </ code> </ p>

DEMO: http://jsfiddle.net/maniator/aksEw/ </ p>
</ div>

展开原文

原文

Try something like this:

JS:

$('#add').click(function(){

    var input = $('#addInput');
    var display = $('#display');
    var form = $('#addForm');

    if($.trim(input.val()).length > 0){ //is there input?
        display.append($('<p>',{text: input.val()}));
        form.append($('<input>',{value: input.val(), type: 'hidden', name: 'added[]'}));
        input.val('');
    }

})

HTML:

<input id="addInput"/> <button id="add">Add</button>

<div id='display'></div>

<form action="something.php" id="addForm">
    <input type="submit" value="SUBMIT"/>
</form>

And then all of the things you add should be in an array called $_POST['added']

DEMO: http://jsfiddle.net/maniator/aksEw/



使用jquery,你可以像这样快速解决:
http://jsfiddle.net/7qTWd/1/ </ p>

  $(”document“)。ready(function(function(  ){

$(“span.add”)。click(function(){
$(“textarea”)。val($(“textarea”)。val()+“
”+ $( “input”)。val());
});
});

&lt; input default =“put text”/&gt;
&lt; span class =“add”&gt; addText&lt; / span&gt ;
&lt; textarea&gt;&lt; / textarea&gt;
</ code> </ pre>
</ div>

展开原文

原文

With jquery you can make a quick solution like this: http://jsfiddle.net/7qTWd/1/

$("document").ready(function(){

    $("span.add").click(function(){
        $("textarea").val( $("textarea").val()+"
"+$("input").val());
    });
});

<input default="put text"/>
<span class="add">addText</span>
<textarea></textarea>

dopt85756
dopt85756 在输入中添加一些内容,然后单击显示addText的文本,然后查看textarea区域...您将看到它执行您所要求的内容。
9 年多之前 回复
douzhu3654
douzhu3654 这只是2个文本框,我想用它做什么...
9 年多之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐