0

我有以下填充 div 元素的表单，更具体地说，是由用户的 Twitter 关注者个人资料图像填充的 Bootstrap 模态表单。

这是表格：http ://d.pr/i/ZJMk

这是完成工作的代码。

<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？

问候。

4

1 回答 1

0

我认为这将是您问题的解决方案，我将这三个属性添加到<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

如果单击“aa-img”，则必须将这 3 个属性传递给隐藏输入，必须添加 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);
      });
 });

希望这会帮助你。

于 2012-06-08T12:40:06.627 回答