如何在jquery中附加数据来移动游标。

时间:2013-08-05 22:22:18

标签: jquery

我正在制作一个闪烁的光标。我需要这个光标应该在数据的末尾闪烁(几秒后的数据)并附加在div中。现在我的光标位置是固定的。现在我需要将光标移动到争论结束。这是尝试。 http://jsfiddle.net/naveennsit/prUYP/

$(document).on('click', '#call', function(event) {


     setInterval(function(){
   $('#realTimeContents' ).append("kkkkkkkkkk"+'\n');

  },3000);
     setInterval(function(){

cursorAnimation();  
  },600);
});


function cursorAnimation() 
{
   // alert("yy")
  $("div.cursor").animate(
  {
    opacity: 0
  }, "fast", "swing").animate(
  {
    opacity: 1
  }, "fast", "swing");
}

我需要这样的结果

kkkkkkk|
KKKKKK  KKKKKKKK|

KKKKKk  kkkkkkkk  kkkkkkk|

1 个答案:

答案 0 :(得分:0)

您可以尝试将.cursor更改为“span”并将其添加到#realTimeContents中并更改append for prepend
HTML

<div data-role="page" id="realTimeScreen" >
 <a href="#" data-role="button" data-corners="false" data-inline="true" id="call" class="" >call</a>
    <div id="realTimeContents" class ="left realtimeContend_h" style="width:97%;"> 
     <span class="cursor" style="font-size:23px;">|</span>
    </div>                       
</div>    

JS

$(document).on('click', '#call', function(event) {
 setInterval(function(){
   $('#realTimeContents' ).prepend("kkkkkkkkkk"+'\n');
  },3000);
 setInterval(function(){

cursorAnimation();  
},600);
});

function cursorAnimation() 
{
  $(".cursor").animate(
  {
    opacity: 0
  }, "fast", "swing").animate(
  {
    opacity: 1
  }, "fast", "swing");
}    

http://jsfiddle.net/prUYP/2/