jQuery函数到引导模态中文本的结果

Question

So my problem is that i have a JQuery function and i want to put the result in a text label in a Bootstrap modal. The real problem is that i cant make a link between the Jquery and Bootstrap. ex. : When the user click on a word, the Bootstrap modal open with the word which was clicked and after the user will change it. It will be great if you can help me.

<div class="container">
    <div class="well well-large">
        <p class="clickable" >
         Change this text and insert some words. 
        </p>
        <div id="form-content" class="modal hide fade in" style="display: none;">
            <div class="modal-header">
                <a class="close" data-dismiss="modal">×</a>
                <h3>Change the word</h3>
            </div>
            <div class="modal-body">
                <form class="contact" name="contact">
                    <label class="label" for="name">Your Text</label><br>
                    <input type="text" name="name" class="input-xlarge"><br>
                </form>
            </div>
            <div class="modal-footer">
                <input class="btn btn-success" type="submit" value="Submit" id="submit">
                <a href="#" class="btn" data-dismiss="modal">Back</a>
            </div>
        </div>
        <div id="thanks"><p><a data-toggle="modal" href="#form-content" class="btn btn-primary btn-large">Modal powers, activate!</a></p></div>
    </div>
</div>

and the Jquery function is

<script>

        $(".clickable").click(function(e){
             s = window.getSelection();
             var range = s.getRangeAt(0);
             var node = s.anchorNode;
             while(range.toString().indexOf(' ') != 0) {                 
                range.setStart(node,(range.startOffset -1));
             }
             range.setStart(node, range.startOffset +1);
             do{
               range.setEnd(node,range.endOffset +1);

            }while(range.toString().indexOf(' ') == -1 && range.toString().trim() != '');
            var str = range.toString().trim();

        $('#form-content').modal('show');
//      return str;
//      alert(str);

       });


    </script>

Answer 1

After you get your str :

var str = range.toString().trim();

you can set it as the value of the input on your modal like so:

$('.modal-body .contact input').val(str);

( Or you could just assign this input an ID and do $('#inputid').val(str); )

Full example: JSFiddle