การเลือกข้อความโดยใช้โปรแกรมในช่องป้อนข้อมูลบนอุปกรณ์ iOS (Safari บนมือถือ)

คุณจะเลือกข้อความของช่องป้อนข้อมูลบนอุปกรณ์ iOS เช่น iPhone, iPad โดยใช้โปรแกรม Safari บนมือถือได้อย่างไร

โดยปกติจะเพียงพอที่จะเรียกใช้.select()ฟังก์ชันบน<input ... />องค์ประกอบ แต่จะไม่ทำงานบนอุปกรณ์เหล่านั้น เคอร์เซอร์จะถูกทิ้งไว้ที่ท้ายรายการที่มีอยู่โดยไม่มีการเลือก

input.setSelectionRange(0, 9999);

https://developer.mozilla.org/en/DOM/Input.select

ไม่มีสิ่งใดในหัวข้อนี้ที่ใช้ได้ผลสำหรับฉันนี่คือสิ่งที่ใช้ได้กับ iPad ของฉัน:

// t is the input field
setTimeout(function() {
    t.setSelectionRange(0, 9999);
}, 1);

เป็นการยากที่จะพิสูจน์ว่าเป็นลบ แต่งานวิจัยของฉันชี้ให้เห็นว่านี่เป็นข้อบกพร่องใน Mobile Safari

โปรดทราบว่า focus () ใช้งานได้ไม่มากก็น้อยแม้ว่าจะต้องแตะมากกว่าหนึ่งครั้งเพื่อให้สำเร็จและก็ไม่จำเป็นหากคุณพยายามตอบสนองต่อการแตะของผู้ใช้ในฟิลด์ที่เป็นปัญหาเนื่องจากการแตะจะให้ฟิลด์ โฟกัส. แต่น่าเสียดายที่เลือก () เป็นเพียงไม่ทำงานใน Mobile Safari

ทางออกที่ดีที่สุดของคุณอาจจะรายงานข้อผิดพลาดกับแอปเปิ้ล

ดูซอนี้ : (ป้อนข้อความในช่องป้อนข้อมูลและคลิก 'เลือกข้อความ')

เป็นการเลือกข้อความใน inputbox บน iPod ของฉัน (iOS6.0.1 เจนเนอเรชั่นที่ 5) เปิดคีย์บอร์ดและแสดงเมนู Cut / Copy / Suggest ...

ใช้จาวาสคริปต์ธรรมดา ไม่ได้ลองกับ jQuery

document.getElementById("p1").selectionStart = 0
document.getElementById("p1").selectionEnd = 999

โปรดทราบว่าตัวเลข 999 เป็นเพียงตัวอย่างเท่านั้น คุณควรตั้งค่าตัวเลขเหล่านี้เป็นจำนวนอักขระที่คุณต้องการเลือก

อัพเดท:

• iPod5 - iOS6.0.1 - ใช้งานได้ดี
• iPad1 - iOS5.1.1 - เลือกเฉพาะข้อความ แตะการเลือกหนึ่งครั้งเพื่อเปิดเมนูตัด / คัดลอก
• iPad2 - iOS4.3.3 - เลือกเฉพาะข้อความ แตะการเลือกหนึ่งครั้งเพื่อเปิดเมนูตัด / คัดลอก

สำหรับสองข้อสุดท้ายคุณอาจทดลองโดยการทริกเกอร์เหตุการณ์คลิกบนinputองค์ประกอบ

อัพเดท: (07-10-2556)

• iPod5 - iOS7.0.2 - การใช้ซอในลิงค์: ไม่เห็นข้อความที่พิมพ์ในช่องป้อนข้อมูล การกดเลือกจะเปลี่ยนเส้นทางฉันไปที่ facebook.com (??? wtf ???) ไม่รู้ว่าเกิดอะไรขึ้น

อัพเดท: (14-11-2556)

• iOS 7.0.3: ขอบคุณความคิดเห็นจากBinkiปรับปรุงว่า .selectionStartและ.selectionEnd ไม่ทำงาน

อัพเดท: (15-01-2558)

• iOS 8.xx: ขอบคุณความคิดเห็นจากไมเคิลเบิร์ท นำมาจากความคิดเห็น: ฉันต้องฟังทั้งโฟกัสและคลิกเหตุการณ์จากนั้น setTimeout / _. debounce เพื่อให้ทำงานได้ในทั้งสองกรณี: คลิกอินพุตหรือโฟกัสผ่านการแท็บ

ขออภัยในโพสต์ก่อนหน้าของฉันฉันไม่สังเกตเห็น Javascript ที่บ่งบอกว่าคุณต้องการคำตอบใน Javascript

เพื่อให้ได้สิ่งที่คุณต้องการในUIWebViewด้วยจาวาสคริปต์ฉันได้จัดการรวบรวมข้อมูลสำคัญสองส่วนเข้าด้วยกันเพื่อให้ใช้งานได้ ไม่แน่ใจเกี่ยวกับเบราว์เซอร์มือถือ

1. element.setSelectionRange(0,9999); ทำในสิ่งที่เราต้องการ

2. เหตุการณ์ mouseUp กำลังยกเลิกการเลือก

ดังนั้น (โดยใช้ Prototype):

    input.observe ('โฟกัส', ฟังก์ชัน () {
      this.setSelectionRange (0, 9999);
    });
    input.observe ('mouseup', ฟังก์ชัน (เหตุการณ์) {
      event.stop ();
    });

เคล็ดลับไม่

ม ธ

ดูเหมือนว่าโฟกัสจะใช้ได้ แต่เมื่อถูกเรียกโดยตรงจากเหตุการณ์ที่เกิดขึ้นเอง โฟกัสการโทรโดยใช้บางอย่างเช่น SetTimeout ไม่ปรากฏเรียกแป้นพิมพ์ การควบคุมแป้นพิมพ์ ios ทำได้แย่มาก มันไม่ใช่สถานการณ์ที่ดี

สิ่งต่อไปนี้ใช้ได้ผลสำหรับฉันบน Webkit ที่มาพร้อมกับ Android 2.2:

function trySelect(el) {
    setTimeout(function() {
        try {
            el.select();
        } catch (e) {
        }
    }, 0);
}

ดูโครเมียมฉบับที่ 32865

ด้วย iOS 7 บน iPad วิธีเดียวที่ฉันสามารถทำงานนี้ได้คือการใช้งานจริง<textarea></textarea>แทน<input>ภาคสนาม

เช่น

<textarea onclick="this.setSelectionRange(0, 9999);">My text will be selected when textarea is clicked.</textarea>

วิธีป้องกันไม่ให้ผู้ใช้เปลี่ยนข้อความภายในพื้นที่นั้นยากกว่าเนื่องจากคุณสร้าง textarea แบบอ่านอย่างเดียวเคล็ดลับการเลือกจะไม่ทำงานอีกต่อไป

ฉันเริ่มมองหาวิธีแก้ปัญหานี้ในขณะที่คำตอบทั้งหมดของคุณช่วยเปิดเวิร์มอีกกระป๋องให้ฉัน

ลูกค้าต้องการให้ผู้ใช้สามารถคลิกและเลือกทั้งหมดได้และยังให้ผู้ใช้'แท็บ' และเลือกทั้งหมดบน iPad (ด้วยแป้นพิมพ์ภายนอกฉันรู้ว่าบ้า ... )

วิธีแก้ปัญหาของฉันคือจัดเรียงเหตุการณ์ใหม่ โฟกัสแรกจากนั้นคลิกจากนั้นแตะเริ่มต้น

$('#myFUBARid').on('focus click touchstart', function(e){
  $(this).get(0).setSelectionRange(0,9999);
  //$(this).css("color", "blue");
  e.preventDefault();
});

ฉันหวังว่านี่จะช่วยใครสักคนเพราะคุณช่วยฉันมาแล้วนับครั้งไม่ถ้วน

หากคุณใช้เบราว์เซอร์ที่รองรับ HTML5 คุณสามารถใช้placeholder="xxx"ในinputแท็กของคุณ ที่ควรทำ