Question

首先，在这里完成newbee。我一直试图克隆一个组合框。我的语言是否合适？基本上我要做的是有一个下拉列表，填充几个字段，然后点击一个添加按钮，再次完成所有操作。我能够填充第一行字段，但克隆后没有任何内容。救命？提前谢谢。

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="js/reCopy.js"></script>
<script type="text/javascript">
$(function(){
var removeLink = ' <a class="remove" href="#" onclick="$(this).parent().slideUp(function(){ $(this).remove() }); return false">remove</a>';

$('a.add').relCopy({ append: removeLink});
});
</script>
<script type="text/javascript">
    var compInfoArray = new Array();

    <?php
        $query1 = "SELECT * FROM bha_product ORDER BY product";
        $result1 = mysql_query($query1) or die(mysql_error());

        // build javascript array
        while($row1=mysql_fetch_array($result1)){ 
            echo 'compInfoArray['.$row1['productid'].'] = new Array();';
            echo 'compInfoArray['.$row1['productid'].']["product"] = "'.$row1['product'].'";';
            echo 'compInfoArray['.$row1['productid'].']["description"] = "'.$row1['description'].'";';
                        echo 'compInfoArray['.$row1['productid'].']["price"] = "'.$row1['price'].'";';
        }
    ?>

    function showname() {
        var productid = document.form1.productid.value;
        document.form1.product.value = compInfoArray[productid]["product"];
        document.form1.description.value = compInfoArray[productid]["description"];
        document.form1.price.value = compInfoArray[productid]["price"];
    }

    window.onload=function() {
        showname();
    } 

</script>
</head>
<body>
    <form name="form1">  
    <p class="clone">   
             <select name="productid" onchange="showname()">
        <option value="">Select Product</option>
        <?php
            $query1 = "SELECT * FROM bha_product ORDER BY product";
            $result1 = mysql_query($query1) or die(mysql_error());

            // build javascript array
            while($row1=mysql_fetch_array($result1)){ 
                echo '<option value="'.$row1['productid'].'">'.$row1['product'].'</option>';
            }
        ?>
        </select>
        <label>
            <input type="text" name="product" value="" />
            <input type="text" name="description" value="" />
            <input type="text" name="price" value="" />


        </label></p><p><a href="#" class="add" rel=".clone">Add More</a></p>
<input type="submit" value=" Submit " />
    <br>    


    <input name="submit" type="submit" id="submit" value="Add" /> 
    </form>
</body>
</html>

Answer 1

不优雅但有效。

  <html>
    <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/
    ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/reCopy.js"></script>
    <script type="text/javascript">
    $(function(){
    var removeLink = ' <a class="remove" href="#" onclick="$(this).parent().slideUp(function(){ $(this).remove() }); return false">remove</a>';

    $('a.add').relCopy({ append: removeLink});
    });
    </script>
    <script type="text/javascript">
        var compInfoArray = new Array();
        <?php
            $query1 = "SELECT * FROM bha_product ORDER BY product";
            $result1 = mysql_query($query1) or die(mysql_error());

            // build javascript array
            while($row1=mysql_fetch_array($result1)){ 
                echo 'compInfoArray['.$row1['productid'].'] = new Array();';
                echo 'compInfoArray['.$row1['productid'].']["product"] = "'.$row1['product'].'";';
                echo 'compInfoArray['.$row1['productid'].']["description"] = "'.$row1['description'].'";';
                echo 'compInfoArray['.$row1['productid'].']["price"] = "'.$row1['price'].'";';
            }
        ?>

        function showname( place ) {
            var productid = $( place ).val();
            $( place ).next().children('input[name="product"]').val(compInfoArray[productid]["product"]);
            $( place ).next().children('input[name="description"]').val(compInfoArray[productid]["description"]);
            $( place ).next().children('input[name="price"]').val(compInfoArray[productid]["price"]);
        }
        var i = 1;
        function clone(){
            $(".exemple_for_clone").clone().removeClass("exemple_for_clone").addClass("clone" + (i + 1)).appendTo("#clone_input_place");
            i++;
        }
    </script>
    </head>
    <body>
        <form name="form1">
        <div style="display: none;">
            <p class="exemple_for_clone">   
                <select name="productid" onchange="showname(this)">
                <option value="">Select Product</option>
                <?php
                    $query1 = "SELECT * FROM bha_product ORDER BY product";
                    $result1 = mysql_query($query1) or die(mysql_error());

                    // build javascript array
                    while($row1=mysql_fetch_array($result1)){ 
                        echo '<option value="'.$row1['productid'].'">' . $row1['product'] . '</option>';
                    }
                ?>
                </select>
                <label>
                    <input type="text" name="product" value="" />
                    <input type="text" name="description" value="" />
                    <input type="text" name="price" value="" />
                </label>
            </p>
        </div>
        <p class="clone0">   
            <select name="productid" onchange="showname(this)">
            <option value="">Select Product</option>
            <?php
                $query1 = "SELECT * FROM bha_product ORDER BY product";
                $result1 = mysql_query($query1) or die(mysql_error());

                // build javascript array
                while($row1=mysql_fetch_array($result1)){ 
                    echo '<option value="'.$row1['productid'].'">' . $row1['product'] . '</option>';
                }
            ?>
            </select>
            <label>
                <input type="text" name="product" value="" />
                <input type="text" name="description" value="" />
                <input type="text" name="price" value="" />
            </label>
        </p>
        <p id="clone_input_place"></p>
        <p><a href="#" class="add" rel=".clone" onclick="clone()">Add More</a></p>
    <input type="submit" value=" Submit " />
        <br>    


        <input name="submit" type="submit" id="submit" value="Add" /> 
        </form>
    </body>
    </html>

从下拉列表中克隆自动填充的文本字段

1 个答案: