问题描述:

I've got this English language page, in which the user has to enter an English phrase into a form. The form is in a modal dialog which is evoked by clicking on an icon. Everything works up to the point of displaying the form in the dialog, but I don't know how to access the user input which will be checked against a regular expression. Here is the jQuery code:

jQuery(document).ready(function() {

var englishTextId = "";

var t2e_dlog = jQuery("div#t2e_dialog").dialog({

autoOpen: false,

modal: true,

position: "center",

resizable: false,

draggable: false,

dialogClass: "t2e_dlog",

height: 140,

width: 380,

create: function() {

jQuery(this).parents(".ui-dialog")

.css("border", "solid black 1px")

.css("background", "#ece6ff")

.css("border-radius", "4px")

.find(".ui-dialog-content")

.css("font-family", "verdana")

.css("font-size", "0.65em")

.css("font-style", "normal")

.css("color", "#1901B2")

.css("padding", "1px")

.find(".ui-dialog-header")

.css("display","none");

}

});

jQuery("span.t2e_icon").on("click", function(evnt) {

t2e_dlog.dialog("open");

evnt.stopPropagation();

var elementId = evnt.target.id;

englishTextId = ("span#t1ee" + elementId.substring(7));

regexId = ("regex" + elementId.substring(7));

// to obscure text associated with the dialog box

jQuery(englishTextId).css({"border-radius" : "3px","background" : "blue", "color" : "blue"});

});

jQuery(function() {

jQuery( "div#t2e_dialog" ).dialog({dialogClass: 't2e_dialog_style1'});

// removes the dialog box title bar

jQuery("#ui-dialog-title-dialog").hide();

jQuery(".ui-dialog-titlebar").removeClass('ui-widget-header');

var input ='<div id="t2e_modal"><p>Please enter the English text here</p><form id="t2e_form" action="#"><input type="text" id="t2e_w" name="t2e_w" size=50><input id="t2e_submit_btn" type="submit" value="Submit"></form></div>';

jQuery("div#t2e_dialog").append(input);

});

// unobscures the text

jQuery(function() {

jQuery("div#t2e_dialog").dialog({

beforeClose: function( event, ui ) {

jQuery(englishTextId).css({"border-radius" : "3px","background" : "", "color" : ""});

}

});

});

});

Any help would be much appreciated.

网友答案:

Here is a example with the keyup event. But you could bind any available events:

jQuery("body").on("keyup", "#t2e_w", function() {
  var input_user = jQuery('#t2e_w').val();
  console.log(input_user);
  //reg expression here ...
});

Fiddle: http://jsfiddle.net/j6R22/22/

相关阅读:
Top