Question

我有以下形式填充div元素，更具体地说是用户的twitter的关注者个人资料图片中的Bootstrap的模态形式。

这是完成工作的代码。

<div class="modal-body">  

  <?php

    $follower_url = "http://api.twitter.com/1/statuses/followers/Mozammil_K.xml";

    $twFriends = curl_init();

    curl_setopt($twFriends, CURLOPT_URL, $follower_url);
    curl_setopt($twFriends, CURLOPT_RETURNTRANSFER, TRUE);
    $twiFriends = curl_exec($twFriends);
    $response = new SimpleXMLElement($twiFriends);

    foreach($response->user as $friends){ 
        $thumb = $friends->profile_image_url;
        $url = $friends->screen_name;
        $name = $friends->name;

    ?>



    <a title="<?php echo $url;?>" href="#"><img class="photo-img" src="<?php echo $thumb?>" border="2" alt="" width="40" onClick="highlight(this)" /></a>
    <?php

    } 

  ?>



</div>

我想让用户可以选择点击照片并选择元素。他们还可以再次点击照片并取消选择。这是通过以下javascript实现的。

<script>

   function highlight(elem) {

    if(elem.style.border == '2px solid blue') {

        elem.style.border = '';
    }
    else{

        elem.style.border = '2px solid blue';

    }

    }

</script>

单击“创建”按钮时，表单应获取突出显示元素的标题，并将元素标题发送到数据库。除了将元素保存到数组并通过JSON发送数据之外，我还没有找到任何方法。我对JSON并不熟悉。还有其他方法（更简单）吗？也许是JQuery？

的问候。

Answer 1

我认为这可以解决您的问题，我将这三个属性添加到<a class='a-img'>标记

      "rel=<?echo $thumb?>" 
      "id=<?echo $name?>" 
      "title=<? echo $url;?>" //these will be the diffrent attr to be send on the database

如果你点击＆＃34; a.a-img＆＃34;这三个属性必须传递给一个隐藏的输入。必须添加3个隐藏字段：

      <input type="hidden" id="sname"/>
      <input type="hidden" id="fname"/>
      <input type="hidden" id="thumb"/>

     <a title="<?php echo $url;? class='a-img'>" href="#">
     <img class="photo-img" src="<?php echo  $thumb?>" border="2" alt="" width="40"   
     onClick="highlight(this)" /></a>
     $(document).ready(function(){

      $("#create").click(function(){
      //get the value of the 3 hidden fields 
      var sname =  $("#sname").val(sname);
      var fname = $("#fname").val(fname);
      var thumb = $("#thumb").val(thumb);

         $.ajax({
             type:"POST",
             url:"//your savetodb.php"
             data:{'sname':sname, 'fname':fname, 'thumb':thumb},
             success: function(data){
                        //do success message
                     }
         });

      });

      $("a.a-img").click(function(){
        var sname = $(this).attt('title');
        var fname = $(this).attr('id');
        var thumb = $(this).attr('rel');
               //these 3 attrbute will pass to a hidden input
                $("#sname").val(sname);
                $("#fname").val(fname);
                $("#thumb").val(thumb);
      });
 });

希望这会对你有所帮助。

选择div中的元素并将数据发送到数据库

1 个答案: