Javascript 在 SweetAlert 中输入文本

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/29920784/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 04:19:16  来源:igfitidea点击:

Input text in sweetAlert

javascriptjquerysweetalert

提问by DomingoSL

I'm using a custom version of sweetalertto ask my user for an input. I have managed to make the everything work but there is an strange behavior, In order to be able to input a text in the input boxyou have to click screen first:

我正在使用Sweetalert的自定义版本向我的用户询问input. 我设法使一切正常,但有一个奇怪的行为,为了能够在输入框中输入文本,您必须先单击屏幕:

swal({
    title: "Aggiornamento profilo",
    text: '<br /><form method="post" id="taxcode-update" name="taxcodeUpdate"><input id="admin-tax-code" minlength="3" class="form-control wedding-input-text wizard-input-pad" type="text" name="taxCode" placeholder="Codice fiscale"></form>',
    type: "warning",
    showCancelButton: false,
    confirmButtonText: "Aggiorna il mio profilo",
    closeOnConfirm: false
}, function () {
    swal("Deleted!", "Your imaginary file has been deleted.", "success");
});

Working example: https://jsfiddle.net/fvkppx06/

工作示例:https: //jsfiddle.net/fvkppx06/

回答by Jai Kumar Rajput

swal({
  title: "An input!",
  text: "Write something interesting:",
  type: "input",
  showCancelButton: true,
  closeOnConfirm: false,
  animation: "slide-from-top",
  inputPlaceholder: "Write something"
},
function(inputValue){
  if (inputValue === false) return false;

  if (inputValue === "") {
    swal.showInputError("You need to write something!");
    return false
  }

  swal("Nice!", "You wrote: " + inputValue, "success");
});

回答by Albzi

JSFiddle

JSFiddle

Give the inputthe autofocustag.

inputautofocus标签。

text: '<br /><form method="post" id="taxcode-update" name="taxcodeUpdate">'
    + '<input id="admin-tax-code" autofocus minlength="3" class="form-control wedding-input-text wizard-input-pad" type="text" name="taxCode" placeholder="Codice fiscale">'
    + '</form>',

回答by Mikeys4u

The variable used is 'name'

使用的变量是“名称”

 const {value: name} = await swal({
  title: 'Input your name',
  input: 'text',
  inputPlaceholder: 'Enter here'
})

if (name) {
  swal('Entered name: ' + name)
}

回答by John Silence

Use Sweetalert2. There are numerous examples for input prompts to be found here, all of them using modern async/await constructs. If you want it the old way, try this:

使用Sweetalert2。有对被发现输入提示的例子不胜枚举这里,所有的人都用现代异步/ AWAIT结构。如果你想要旧的方式,试试这个:

Swal.fire({
    title: "An input!",
    text: "Write something interesting:",
    input: 'text',
    showCancelButton: true        
}).then((result) => {
    if (result.value) {
        console.log("Result: " + result.value);
    }
});

回答by narsis fe

Just test this

只是测试这个

swal.withForm({
   title: 'Cool example',
   text: 'Any text that you consider useful for the form',
   showCancelButton: true,
   confirmButtonColor: '#DD6B55',
   confirmButtonText: 'Get form data!',
   closeOnConfirm: true,
   formFields: [
       { id: 'name', placeholder:'Name Field' },
       { id: 'nickname', placeholder:'Add a cool nickname' }
   ], function(isConfirm) {
   // do whatever you want with the form data
   console.log(this.swalForm); // { name: 'user name', nickname: 'what the user sends' }
})

https://github.com/taromero/swal-forms

https://github.com/taromero/swal-forms

回答by Sasi

Use this :

用这个 :

Swal.fire({
title: "An input!",
text: "Write something interesting:",
input: 'text',
showCancelButton: true ,
confirmButtonColor: 'green'
}).then((result) => {
if (result.value) {
    Swal.fire('Result:'+result.value);
}});