与选择框（点击时）的Jquery

-1

绑定文本创建的小应用程序从textarea的文本添加到div的block..I希望在黄格文本用户点击得不到追加和属性（字体，字体大小）选定的文本还强调在选择框与选择框（点击时）的Jquery

$(document).ready(function() { 
    $('#page1').click(function(e){ 
    var $el = $("<li class='text'>"+$('#ta').val()+"</li>"), 
     $this = $(this), offset = $this.offset(); 
    $el.css({ 
     position: 'absolute', 
     left: e.pageX - offset.left, 
     top: e.pageY - offset.top 
    }); 
    $this.append($el); 
    ($el).draggable(); 
    $("#page1 li").click(function(){ 
    $("#page1 li").removeClass('active'); 
    $(this).addClass("active"); 

    }); 
}); 
     $("#fs").change(function() { 
      $('li.active').css("font-family", $(this).val()); 
     }); 
     $("#size").change(function() { 
      $('li.active').css("font-size", $(this).val() + "px"); 
     }); 

     });

的jsfiddle链接：http://jsfiddle.net/sharma_pooja/P2Kyk/31/

来源

2012-12-29 pooja9

所以你有什么问题？ – doniyor

你可能会更具体一点。你想获得一个值或点击坐标，这将是page.X等 – adeneo

什么是不适合你？ – ATOzTOA

$('#block').click(function(e){ 

    var $this = $(this); 
    var $textBlock = $this.children('p'); 
    var _offset = $this.offset(); 

    $textBlock.css({ 
     position: 'relative', 
     left: e.pageX - _offset.left, 
     top: e.pageY - _offset.top 
    }); 

});

并添加CSS overflow: hidden;到#block类。当位于块边界附近时，它将隐藏剩余的文本，这些文本将溢出块。

UPDATE

对于拖动选项，你应该使用jQuery UI并能做到不便。这样

$('#block p') 
    .draggable() // for moving the `<p>` around with your mouse 
    .disableTextSelect(); // to disable text selection inside container

这里是fiddle这两种情况下：单击父容器并拖动文本块本身时。

来源

2012-12-29 09:42:58

感谢您的答复！在每一次点击它追加文本可以帮助我如何选择文本并将其拖动到任何地方？ – pooja9

@ pooja9，我已经在你的小提琴中测试过它，它没有追加任何东西，它只是移动到'click'事件的适当坐标。据我所知，你需要在这里使用“drag-n-drop”选项。我对吗？ –

@ pooja9，我已经更新了我的答案。 –

如果您要添加文本的段落，这将havee在＃阻止元素打你用鼠标点COORDS，那么你“将不得不做到以下几点：

1）添加位置：相对于＃阻止元素的CSS

2）改变＃阻止点击事件处理，像这样：

$('#block').click(function(e){ 
     var $el = $("<p>"+$('#ta').val()+"</p>"), 
      $this = $(this), offset = $this.offset(); 
     $el.css({ 
      position: 'absolute', 
      left: e.pageX - offset.left, 
      top: e.pageY - offset.top 
     }); 
     $this.append($el); 
    });

来源

2012-12-29 07:44:54

感谢您的答复！每次点击它附加文本可以帮助我如何选择文本并将其拖动到任何地方？ – pooja9

与选择框（点击时）的Jquery

回答

相关问题