ช่องป้อนข้อความ

ช่องป้อนข้อความจะจัดเก็บสตริงเป็นค่าและสตริงเป็นข้อความ ค่าของฟิลด์จะเป็นสตริงที่ถูกต้องเสมอ ส่วนข้อความอาจเป็นสตริงใดก็ได้ที่ป้อนลงในเครื่องมือแก้ไข

ช่องป้อนข้อความ

ช่องป้อนข้อความที่เปิดเครื่องมือแก้ไข

ช่องป้อนข้อความในบล็อกที่ยุบ

การสร้างวิดีโอ

JSON

{
  "type": "example_textinput",
  "message0": "text input: %1",
  "args0": [
    {
      "type": "field_input",
      "name": "FIELDNAME",
      "text": "default text",
      "spellcheck": false
    }
  ]
}

JavaScript

Blockly.Blocks['example_textinput'] = {
  init: function() {
    this.appendDummyInput()
        .appendField("text input:")
        .appendField(new Blockly.FieldTextInput('default text'),
            'FIELDNAME');
  }
};

ตัวสร้างอินพุตข้อความจะรับค่าที่ไม่บังคับและโปรแกรมตรวจสอบที่ไม่บังคับ ค่าควรแคสต์เป็นสตริง หากเป็น null หรือ undefined ระบบจะใช้สตริงว่าง

นอกจากนี้ คําจํากัดความ JSON ยังให้คุณตั้งค่าตัวเลือกตรวจตัวสะกดได้ด้วย

การจัดรูปแบบและ XML

JSON

JSON สำหรับช่องป้อนข้อความมีลักษณะดังนี้

{
  "fields": {
    "FIELDNAME": "text"
  }
}

โดยที่ FIELDNAME คือสตริงที่อ้างอิงช่องป้อนข้อความ และค่าคือค่าที่จะใช้กับช่อง ค่าจะเป็นไปตามกฎเดียวกับค่าคอนสตรคเตอร์

XML

XML สำหรับช่องป้อนข้อความมีลักษณะดังนี้

<field name="FIELDNAME">text</field>

โดยที่แอตทริบิวต์ name ของช่องมีสตริงที่อ้างอิงช่องอินพุตข้อความ และข้อความภายในคือค่าที่จะใช้กับช่อง ค่าข้อความภายในจะเป็นไปตามกฎเดียวกับค่าคอนสตรคเตอร์

การปรับแต่ง

ตรวจตัวสะกด

คุณสามารถใช้ฟังก์ชัน setSpellcheck เพื่อตั้งค่าว่าต้องการให้ช่องตรวจตัวสะกดข้อความอินพุตหรือไม่

ช่องป้อนข้อความที่มีและไม่มีการตรวจตัวสะกด

การตรวจตัวสะกดจะเปิดอยู่โดยค่าเริ่มต้น

ซึ่งมีผลกับแต่ละช่อง หากต้องการแก้ไขทุกช่อง ให้เปลี่ยนพร็อพเพอร์ตี้ Blockly.FieldTextInput.prototype.spellcheck_

การสร้างโปรแกรมตรวจสอบการป้อนข้อความ

หมายเหตุ: ดูข้อมูลทั่วไปเกี่ยวกับโปรแกรมตรวจสอบได้ที่โปรแกรมตรวจสอบ

ค่าของช่องป้อนข้อความคือสตริง ดังนั้นโปรแกรมตรวจสอบต้องยอมรับสตริงและแสดงผลสตริง null หรือ undefined

ต่อไปนี้คือตัวอย่างโปรแกรมตรวจสอบที่นําอักขระ "a" ทั้งหมดออกจากสตริง

function(newValue) {
  return newValue.replace(/a/g, '');
}