带输入文本框的 Jquery 对话框

Question

我想使用jquery对话框来收集用户信息(例如用户名)。我如何使用 Jquery 做到这一点并将数据收集到 Javascript 变量中？

这是我迄今为止的尝试:

// Dialog here, how to rewrite this?
$('<form> <input type="text" style="z-index:10000" name="name"> <br> </form>').dialog({modal:true});

// push data to Parse
var Label = Parse.Object.extend("Label");
var result = new Label();
result.set("labels", localStorage.getItem("labels"));
result.set("name", name);

result.save(null, {
  sucess : function(result) {
    alert("Stored data sucessfully!");
  },
  error: function(result, error) {
    alert("Error submitting data, error code:" + error.message);
  }
});

但是我还无法输入文字。

Answer 1

您可以将任何您想要的功能放入按钮部分，这样当用户单击“确定”时，您就可以处理他们的信息。这方面的文档是 here 。例如:

$('<form><input type="text" style="z-index:10000" name="name"><br></form>').dialog({
  modal: true,
  buttons: {
    'OK': function () {
      var name = $('input[name="name"]').val();
      storeData(name);
      $(this).dialog('close');
    },
    'Cancel': function () {
      $(this).dialog('close');
    }
  }
});

这里有一个 fiddle ，展示了它的实际效果(尽管没有样式):http://jsfiddle.net/duffmaster33/zuervqop/1/