javascript - 当我将 div 放在可放置区域时，如何获取输入文本值(从数据库)？

Question

我使用数据库制作了可拖动的div。我想获取 drophandler 事件中的输入类型值。但显示为空白。

我的 JavaScript

  $ (init);
    function init() {
        $(".drag").draggable({
            start: handleDragStart,
            cursor: 'move',
            revert: "invalid",
        });
        $("#drop").droppable({
            drop: handleDropEvent,
            tolerance: "touch",              
        });

    }
    function handleDragStart (event, ui) {
        $(this).css('z-index', 9999);
    }       
    function handleDropEvent (event, ui) {

        $(this).append(ui.draggable);
        var droppedElement = ui.draggable;

          var popUp = droppedElement.find('#btnAddtujuan');
           popUp.on('click', function(event) {
            $("#registerDiv").fadeIn(1000);
            $("#popup").fadeIn(100);
             event.preventDefault();
        });

       var typeidsetresult  = droppedElement.find('#typeid');
        var choice = typeidsetresult.html();
      alert(choice);        
             $('#typeidset').val(choice);

    }

这是我的代码:

<div class="col-md-3" id="right" style="margin-top: -1.5%;">

                   <?php        $conn = new mysqli(DB_SERVER, DB_USER, DB_PASSWORD, DB_DATABASE);


                            $sample = " select * from definetype ";
                                     $resultsample = $conn->query($sample);

                                          if($resultsample->num_rows >0)
                                        {
                                            echo '<div class="row">';
                                            while($rowresultsample = $resultsample->fetch_assoc())
                                            {         

                                              $type = $rowresultsample['type'];

                                   ?>
                                   <div class="drag" >
                                   <div id="btnAddtujuan">
                                   <img src="<?php echo $rowresultsample['img'];?>" id="imagetargettype" />
                                   <input  style="color:black;background-color:white;" name="typeid" id="typeid" value="<?php  echo $type;?>" />
                     </div></div>

        <?php } }?>
            <div id="popup">
                  <div id="popupinfo">
                    <div id="registerDiv">
                      <form style="background-color: white;" id="targetinsert1">
                  <input type="text"  value="" id="typeidset" disabled="disabled"/>
                 </form>
                    </div>
                  </div>
                </div>   
         <div id="drop" class="ui-widget-header" style="width: 100%;height:100%;">  <img style="padding-top:5%;" src="<?php echo $rowquerycat2[KEY_TARGETIMAGENAME]; ?>" id="target" alt="" class="img-responsive" /></div>

我想获取输入文本值<input style="color:black;background-color:white;" name="typeid" id="typeid" value="<?php echo $type;?>" />的值并将值传递给 <input type="text" value="" id="typeidset" disabled="disabled"/> (在弹出的 div 中)当我放下 div 时。

我引用并编码了一些东西。我通过警报消息测试，它显示空白。

Answer 1

您选择typeid的代码不正确。您需要更改以下代码:

var typeidsetresult  = droppedElement.find('#typeid');

通过这个:

var typeidsetresult  = $('.popup').find('#typeid');

因为 typeid 是 $('.popup') 的子级，而不是 droppedElement。