2012-02-10 75 views
0

我正在嘗試在輸入字段中的文本末尾插入文本?我如何去做呢?如何在輸入字段中插入文本

這裏是我到目前爲止的代碼

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
     <script type="text/javascript" src="src/jquery.tokeninput.js"></script> 

     <link rel="stylesheet" href="styles/token-input.css" type="text/css" /> 
     <link rel="stylesheet" href="styles/token-input-facebook.css" type="text/css" /> 

     <script type="text/javascript"> 
      $(document).ready(function() { 
       $("input[type=button]").click(function() { 
        alert("Would submit: " + $(this).siblings("input[type=text]").val()); 
       }); 
      }); 

$.fn.setCursorPosition = function(position){ 
    if(this.lengh == 0) return this; 
    return $(this).setSelection(position, position); 
} 

$.fn.setSelection = function(selectionStart, selectionEnd) { 
    if(this.lengh == 0) return this; 
    input = this[0]; 

    if (input.createTextRange) { 
     var range = input.createTextRange(); 
     range.collapse(true); 
     range.moveEnd('character', selectionEnd); 
     range.moveStart('character', selectionStart); 
     range.select(); 
    } else if (input.setSelectionRange) { 
     input.focus(); 
     input.setSelectionRange(selectionStart, selectionEnd); 
    } 

    return this; 
} 

$.fn.focusEnd = function(){ 
    this.setCursorPosition(this.val().length); 
} 





    $(document).ready(function() { 
    $('.num-block').hide(); 
    $('.addnum').click(function() { 
     $('.num-block').slideToggle("slow"); 


    }); 
    }); 


    $(document).ready(function() { 
$('#button1').click(function() { 
     //$('#some-text').focus(); 

$("#some-text").focusEnd(); 
     }); 


     }); 

</script> 

    <style type="text/css"> 
    .num-block { bordeR:1px solid #000; width:700px;margin-top:40px;} 
    </style> 
</head> 

<body> 


        <div class="block-1"> 
        <!-- dependents information -->  
        <input id="some-text" type="text" value=" some text goes here" />      
           <a href="#" class='addnum adddel'><span>Add Number</span></a> 



           <div class="num-block"> 

           <!-- phone --> 
           <div> 
            Enter Phone:<input type="text" id="demo-input-local" name="blah" /><input type="button" #id="button1" value="Submit" /> 
            <script type="text/javascript"> 
             $(document).ready(function() { 
              $("#demo-input-local").tokenInput([ 
              /* { id: 7, name: "[email protected]", "value": "@" , "prefix": "Email1"}, 
              { id: 11, name: "[email protected]", "value": "@" ,"prefix": "Email2"}, 
              { id: 13, name: "[email protected]", "value": "@" ,"prefix": "Email3"}, 
              { id: 17, name: "[email protected]", "value": "@", "prefix": "Email4" }, 
              { id: 19, name: "[email protected]", "value": "@", "prefix": "Email5" }, 
              { id: 23, name: "www.C#.com", "value": "http", "prefix": "Website1" }, 
              { id: 29, name: "www.C.com", "value": "http", "prefix": "Website2" }, 
              { id: 31, name: "www.Fortran.com", "value": "http", "prefix": "Website3" }, 
              { id: 37, name: "www.VisualBasic.com", "value": "http", "prefix": "Website4" }, 
              { id: 41, name: "www.DoC.com", "value": "http", "prefix": "Website5" }, 
              { id: 43, name: "www.C++.com", "value": "http" , "prefix": "Website6"}, 
              { id: 47, name: "www.Java.com", "value": "http" , "prefix": "Website7"}, */ 
              { id: 37, name: "111-111-1111", "value": "#", "prefix": "Phone1" }, 
              { id: 41, name: "222-222-2222", "value": "#", "prefix": "Phone2" }, 
              { id: 43, name: "333-333-3333", "value": "#" , "prefix": "Phone3"}, 
              { id: 47, name: "555-555-5555", "value": "#" , "prefix": "Phone4"} 


             ], { 
              theme: "facebook", 
              propertyToSearch: "value", 
              hintText: "Type '@' for email or 'http' for website or '#' for phone", 
              tokenFormatter: function (item) { return "<li><p>" + item.prefix + "</p></li>" }, 
              resultsFormatter: function (item) { return "<li>" + item.prefix +" "+ item.name + "</li>" } 
             }); 
             }); 
            </script> 
           </div> 


           <!--- End Phone --> 


           </div> 


           </div> 

        </div> 

回答

4

將該值設置爲當前值,加上任何你想要的:

$('#input_selector').val($('#input_selector').val() + 'My new text')